@charset "utf-8";
/* CSS Document */

div.proBase ul.sldList.atami li.sld1{background-image: url(../images/sld1.jpg);}
div.proBase ul.sldList.atami li.sld2{background-image: url(../images/sld2.jpg);}
div.proBase ul.sldList.atami li.sld3{background-image: url(../images/sld3.jpg);}
div.proBase ul.sldList.atami li.sld4{background-image: url(../images/sld4.jpg);}
div.proBase ul.sldList.atami li.sld5{background-image: url(../images/sld5.jpg);}
div.proBase ul.sldList.atami li.sld6{background-image: url(../images/sld6.jpg);}

@media screen and (max-width: 899px){
    div.proBase ul.sldList.atami li.sld1{background-image: url(../images/sld1_sp.jpg);}
    div.proBase ul.sldList.atami li.sld2{background-image: url(../images/sld2_sp.jpg);}
    div.proBase ul.sldList.atami li.sld3{background-image: url(../images/sld3_sp.jpg);}
    div.proBase ul.sldList.atami li.sld4{background-image: url(../images/sld4_sp.jpg);}
    div.proBase ul.sldList.atami li.sld5{background-image: url(../images/sld5_sp.jpg);}
    div.proBase ul.sldList.atami li.sld6{background-image: url(../images/sld6_sp.jpg);}
}

div.seg5{padding: 0 0 50px;}
div.seg5 div.inner{background: #f4f3f0;}
div.seg5 div.topBlock{background: url(../images/booking_bg_pc.jpg) no-repeat center center; background-size: cover; padding: 55px 0 60px;}
div.seg5 div.topBlock p{color: #444;}
div.seg5 div.topBlock p.date{font-size: 3.6rem;}
div.seg5 div.topBlock p.date small{font-size: 2.2rem; padding: 0 5px;}
div.seg5 div.topBlock p.title{font-size: 3.3rem; font-weight: bold; padding: 0 0 30px;}
div.seg5 div.topBlock p.btn{}
div.seg5 div.topBlock p.btn span{color: #FFF; font-size: 4.0rem; line-height: 67px; background: url(../images/frame_booking_pc.png) no-repeat center center; background-size: 450px 70px; display: block; padding: 0 0 3px; margin: 0 auto;}
div.seg5 div.bottomBlock{padding: 50px 0 65px;}
div.seg5 div.bottomBlock h2{color: #444; font-size: 2.3rem; padding: 0 0 40px;}
div.seg5 div.memberWrap{display: flex; justify-content: space-between; width: 80%; min-width: 700px; max-width: 880px; margin: 0 auto;}
div.seg5 div.memberWrap div.block{width: 210px;}
div.seg5 p.btn span{color: #FFF; font-size: 4.0rem; line-height: 67px; background: url(../images/frame_booking_pc.png) no-repeat center center; background-size: 880px 70px; display: block; padding: 0 0 3px; margin: 30px auto 0;}
div.seg5 p.btn2 span{color: #FFF; font-size: 4.0rem; line-height: 67px; background: url(../images/frame_booking_pc.png) no-repeat center center; background-size: 880px 70px; display: block; padding: 0 0 3px; margin: 30px auto 0;}
div.seg5 p.btn3 span{color: #FFF; font-size: 4.0rem; line-height: 67px; background: url(../images/frame_booking_pc2.png) no-repeat center center; background-size: 880px 70px; display: block; padding: 0 0 3px; margin: 30px auto 0;}
div.seg5 p.btn4 span{color: #FFF; font-size: 1.6rem; line-height: 67px; background: url(../images/frame_booking_pc2.png) no-repeat center center; background-size: 880px 70px; display: block; padding: 0 0 3px; margin: 30px auto 0;}
div.seg5 div.memberWrap div.block h3{font-size: 2.1rem; color: #009574; font-weight: bold; padding: 0 0 20px;}
div.seg5 div.memberWrap div.block p.mark{padding: 0 0 15px;}
div.seg5 div.memberWrap div.block p.mark span{width: 50px; height: 50px; border-radius: 50%; font-size: 3.6rem; line-height: 50px; background: #b4b3b5; color: #FFF; display: block; margin: 0 auto;}
div.seg5 div.memberWrap div.block p.date{background: #b4b3b5; color: #FFF; font-weight: bold; padding: 12px 0 13px;}
div.seg5 div.memberWrap div.block p.date span{font-size: 2.5rem; line-height: 1.3; display: block;}
div.seg5 div.memberWrap div.block p.date span.s{font-size: 1.4rem;}
div.seg5 div.memberWrap div.block.gold p.mark span,
div.seg5 div.memberWrap div.block.gold p.date{background: #acac8a;}
div.seg5 div.memberWrap div.block.blue p.mark span,
div.seg5 div.memberWrap div.block.blue p.date{background: #1a4289;}

/* ::::::::::::::::::::::::::::::::: PC ::::::::::::::::::::::::::::::::: */
@media screen and (min-width: 900px){
    .sp{display:none!important;}
    
    .hoverAlpha{transition: opacity 0.2s ease;}
    .hoverAlpha:hover{opacity: 0.8;}
	
	div.seg5 p.btn2 span{ display:none ;}
	div.seg5 p.btn4 span{ display:none ;}
}

@media screen and (max-width: 899px){
    .pc{display:none!important;}
	div.seg5{padding: 0 0 15px;}
    div.seg5 div.inner{}
    div.seg5 div.topBlock{background-image: url(../images/booking_bg_sp.jpg); padding: 40px 0 40px;}
    div.seg5 div.topBlock p{}
    div.seg5 div.topBlock p.date{font-size: 2.7rem; line-height: 1.4; padding: 0;}
    div.seg5 div.topBlock p.date small{font-size: 1.7rem;}
    div.seg5 div.topBlock p.title{font-size: 2.6rem; padding: 0 0 15px; line-height: 1.7;}
    div.seg5 div.topBlock p.btn{}
    div.seg5 div.topBlock p.btn span{font-size: 2.1rem; line-height: 35px; background-image: url(../images/frame_booking_sp.png); background-size: 240px 37px; padding: 0 0 2px;}
    div.seg5 div.bottomBlock{padding: 40px 15px 50px;}
    div.seg5 div.bottomBlock h2{font-size: 1.7rem; padding: 0 0 35px;}
    div.seg5 div.memberWrap{width: 100%; min-width: 200px;}
    div.seg5 div.memberWrap div.block{width: 31%;}
    div.seg5 div.memberWrap div.block h3{font-size: 1.6rem; padding: 0 0 15px;}
    div.seg5 div.memberWrap div.block p.mark{padding: 0 0 12px;}
    div.seg5 div.memberWrap div.block p.mark span{width: 40px; height: 40px; font-size: 2.9rem; line-height: 40px;}
    div.seg5 div.memberWrap div.block p.date{padding: 12px 5px 13px;}
    div.seg5 div.memberWrap div.block p.date span{font-size: 1.7rem; line-height: 1.5;}
    div.seg5 div.memberWrap div.block p.date span.s{font-size: 1.3rem;}
    div.seg5 div.memberWrap div.block.gold p.mark span,
    div.seg5 div.memberWrap div.block.gold p.date{}
    div.seg5 div.memberWrap div.block.blue p.mark span,
    div.seg5 div.memberWrap div.block.blue p.date{}
	
	div.seg5 p.btn span{ display:none ; }
	div.seg5 p.btn3 span{ display:none ; }
	
}