/* CSS Document */

.fadein {
  opacity: 0;
  transform : translate(0, 30px);
  transition : all 1500ms;
}
.fadein2 {
  opacity: 0;
  transform : translate(0, 0);
  transition : all 1500ms;
}
.fadein3 {
  opacity: 0;
  transform : translate(0, 15px);
  transition : all 3000ms;
}
.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}



body.newshoplist #contents .inner{
    background: url("./bg.gif");
    padding: 80px;    
}

body.newshoplist #contents h2{
    background: none;
    padding: 0 0 50px;
    text-align: left;
}
body.newshoplist.pc #contents h2{
    width: auto;
}
body.newshoplist #contents-main h3{
    border: 0;
    background: none;
    padding: 0;
    margin-bottom: 30px;
    position: relative;
}
body.newshoplist #contents-main h3::before{
    content:"";
    width: 100px;
    height: 1px;
    border-bottom: 1px solid #333;
    position: absolute;
    left: 20%;
    top: 45%;
}
body.newshoplist #contents-main h3::after{
    content:"";
    width: 100px;
    height: 1px;
    border-bottom: 1px solid #333;
    position: absolute;
    right: 20%;
    top: 45%;
}

.nav_box{
    margin: 0 auto 50px;
    width: 80%;
}

.nav_box ul{
    font-size: 0;
}

.nav_box ul li{
    display: inline-block;
    width: calc(100%/2 - 20px);
    text-align: center;
    margin: 0 10px;
}
.nav_box ul li a{
    display: block;
    width: 100%;
    height: 100%;
    font-size: 24px;
    font-weight: bold;
    padding: 30px;
    color: #FFF;
    box-sizing: border-box;
    position: relative;
}
.nav_box ul li.a_new a{background: #92d3ef;}
.nav_box ul li.a_renew a{background: #b9dd22;}

.nav_box ul li a::after{
    font-family: "font Awesome 5 Free";
    font-weight: bold;
    content: "\f107";
    position: absolute;
    top: 35%;
    right: 22px;
    display: block;
    font-size: 24px;
}

.section {
    margin: 0 auto 80px;
}
.section:last-child {margin: 0 auto;}

.section article{
    background: #FFF;
    box-shadow: 3px 3px 0 0 #333;
    box-sizing: border-box;
    padding: 45px;
    overflow: hidden;
    position: relative;
    margin: 0 auto 50px;
}
.section article:last-of-type{margin: 0 auto;}

.imgbox{
    float: left;
    width: 330px;
    overflow: hidden;
}
.imgbox img{
    width:100%;
    height: 280px;
    object-fit: cover;
}
.txtbox{
    float: right;
    width: 380px;
}

.section article .btn{
    position: absolute;
    bottom: 15px;
    right: 15px;
    background: #ccc;
    padding: 10px 30px;
    color: #FFF;
    font-weight: bold;
}

.section article a{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.txtbox .openday{
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    color: #FFF;
    padding: 15px 0;
    margin: 0 0 20px;
    width: 80%;
}
.txtbox .openday p{transform: skewX(10deg);}
.txtbox .openday span{font-size: 24px;}

.txtbox .shopsummery{overflow: hidden; margin: 0 auto 30px;}
.txtbox .shopsummery .logo{width:120px; float: left; margin-right: 20px;}
.txtbox .shopsummery .logo img{width:100%; vertical-align: bottom;}

.txtbox .shopsummery h4{font-size: 20px; font-weight: bold; margin-bottom: 8px;}

.txtbox .concept{clear: both;}
.txtbox .concept p{margin-bottom: 8px;}
.txtbox .concept span{background: #fcf8d7;padding: 0px 10px;}

#newopen_list article{box-shadow: 3px 3px 0 0 #92d3ef;}
#newopen_list article .btn{background: #92d3ef;}
#newopen_list article .txtbox .openday{background: #92d3ef; transform: skewX(-10deg);}
#renewal_list article{box-shadow: 3px 3px 0 0 #b9dd22;}
#renewal_list article .btn{background: #b9dd22;}
#renewal_list article .txtbox .openday{background: #b9dd22; transform: skewX(-10deg);}



/*//////////////////////////////スマホ//////////////////////////////*/


body.newshoplist.sp #contents .inner{ padding: 20px;}

body.newshoplist.sp #contents h2{ padding: 0 0 30px;}

body.newshoplist.sp #contents-main h3::before {width: 80px; left: 0%;}
body.newshoplist.sp #contents-main h3::after {width: 80px; right: 0%;}

.sp .nav_box {  margin: 0px auto 30px;  width: 100%;}

.sp .nav_box ul li a{font-size: 16px; padding: 15px;}

.sp .nav_box ul li a::after{top: 28%; right: 12px; font-size: 18px}


.sp .section article{padding: 30px;}

.sp .imgbox,
.sp .txtbox,
.sp .txtbox .shopsummery .logo{float: none; width: 100%;}

.sp .imgbox{margin-bottom: 20px;}
.sp .imgbox img{height: 230px;}
.sp .txtbox .openday{font-size: 24px; padding: 12px 0;}

.sp .txtbox .shopsummery{margin: 0 auto 20px;}
.sp .txtbox .shopsummery .logo{
    margin: 0 auto 20px;
    width: 50%;
}

.sp .section article .btn{
position: inherit;
bottom: inherit;
right: 0;
display: block;
margin: 20px auto 0;
width: 50%;
text-align: center;}