@charset "utf-8";

main{padding-top:119px; background:#f2f1f1;}
.pan{overflow:hidden; width:1124px; margin:0 auto; padding:11px 0;}
.pan li{float:left; font-size:12px;}
.pan li:after{content:'>'; margin:0 15px; color:#bdbdbd;}
.pan li:last-child:after{content:none;}
.mainvisual{margin-bottom:30px;}
.mainvisual a{position:relative; display:block;}
.mainvisual a img{transition:opacity .5s;}
.swiper-slide-active a:hover img,.swiper-slide-duplicate-active a:hover img{opacity:.7;}
.load .swiper-slide a:before{transition:auto;}
.swiper-slide a:before{content:''; position:absolute; top:0; left:0; width:100%; height:100%; transition:.5s;}
.swiper-slide-prev a:before,
.swiper-slide-duplicate-prev a:before,
.swiper-slide-next a:before,
.swiper-slide-duplicate-next a:before{background:rgba(255,255,255,0.5);}
.swiper-slide-active a:before,
.swiper-slide-duplicate-active a:before{background:rgba(255,255,255,0); transition:1s;}
.container{max-width:1124px;}
.contents{overflow:hidden; width:1124px; margin:0 auto 80px; border:none; background:#f2f0f1;}
article{
    width: calc(100% - 308px);
    padding: 29px;
    border: 1px #e7e7e7 solid;
    background: #fff;
    float: left;
}
article h2{margin-bottom:32px; padding:18px 10px; font-size:24px; text-align:center; color:#018fe1; background:#daedfb;}
article > dl{margin-bottom:32px; padding-bottom:25px; border-bottom:#f1f1f1 solid 3px;}
article > dl:last-of-type{margin-bottom:60px;}
article > dl dt{margin-bottom:7px; color:#888; font-size:12px;}
article > dl dt.new:before{content:'NEW'; margin-right:4px; color:#029fec;}
article > dl dd{font-weight:bold; font-size:14px; word-break:break-all;}
article finli{position: relative; overflow: hidden; padding: 10px 17px 10px 10px; border: 3px solid #4D697A;}
article li{position:relative; overflow:hidden; padding:10px 17px 10px 10px; border:#008ee0 3px solid;}
article li + li{margin-top:10px;}
article li > em{position:absolute; top:0; left:0; display:flex; align-items:center; justify-content:center; width:70px; height:100%; font-size:18px; color:#fff; font-weight:bold; background:#008ee0;}
article li .details{position:relative; overflow:hidden; float:right; width:calc(100% - 70px);}
article li .details p{float:left;}
article li .details p em{display:block; font-weight:bold; font-size:18px;}
article li .details p.day{display:flex; align-items:center; justify-content:center; position:absolute; top:0; width:140px; height:100%; padding:20px 5px; text-align:center; font-size:12px; background:#ecf7fd;}
@media all and (-ms-high-contrast:none){article li .details p.day{padding:23px 5px 17px;}}
article li .details p.day em{margin-bottom:10px; font-size:18px;}
article li .details p.day em span{margin-bottom:10px; font-size:16px;}
article li .details p.area{width:calc(100% - 286px); margin:0 10px 0 150px; padding:17px 0; font-size:14px;}
article li .details p.area em{margin-bottom:5px; font-size:16px; line-height:1.3;}
article li .details a{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	display: block;
	width: 126px;
	height: 36px;
	padding: 11px 10px 11px 27px;
	font-size: 14px;
	text-align: center;
	border: 1px #e7e7e7 solid;
	background: #f2f0f1 url(../img/icon-arrow.png) no-repeat 15px center;
	transition: .5s;
}
article li .details a:hover{text-decoration:none; opacity:.7;}
aside{float:right; width:278px; margin-left:30px;}
aside div{margin-bottom:30px; padding:9px 9px 3px; border:1px #e7e7e7 solid; background:#fff;}
aside h3{margin-bottom:11px; padding:16px 10px 10px; font-size:22px; text-align:center; background:#ecf7fd;}
aside h3 span{display:block; margin-top:8px; font-size:12px; font-weight:normal;}
aside .recommend li + li{margin-top:10px;}
aside .attention{padding:18px 20px; line-height:1.65; font-size:12px; border:#000 1px solid;}
aside a img{width:100%; height:auto; transition:opacity .5s; backface-visibility:hidden;}
aside a:hover img{opacity:.7;}



/* for SP */
@media screen and (max-width:750px){

header .inner .clearfix.sp{margin-right:11.866667vw;}
header .inner .clearfix.sp a + a{margin-left:2.34375vw;}
.pan{width:auto; padding:2vw 3.125vw;}
.pan li{font-size:2.666667vw;}
.pan li:after{margin:0 2.666667vw;}
main{padding-top:16vw;}
.mainvisual{margin-bottom:0;}
.mainvisual a img{transition:auto;}
.mainvisual a:hover img{opacity:1!important;}
.mainvisual a:before{content:none!important;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom:3.6vw;}
.container{max-width:100%;}
.contents{width:100%; margin:0; padding:4vw 1.333333vw 10.666667vw;}
article{float:none; width:100%; margin-bottom:7.866667vw;}
article h2{margin-bottom:5.333333vw; padding:2.8vw 1.5625vw; font-size:4vw;}
article h2:nth-of-type(2){margin-bottom:4.666667vw;}
article > dl{margin-bottom:5.6vw; padding-bottom:4.4vw; border-width:0.8vw;}
article > dl:last-of-type{margin-bottom:10.533333vw;}
article > dl dt{margin-bottom:1.333333vw; font-size:2.933333vw;}
article > dl dt.new:before{margin-right:0.666667vw;}
article > dl dd{font-size:3.2vw;}
article li{padding:4vw 2.666667vw;}
article li + li{margin-top:5.333333vw;}
article li > em{position:static; display:block; width:auto; height:auto; margin:-4vw -2.666667vw 2.666667vw; padding:1.333333vw 2.666667vw; font-size:3.733333vw;}
article li .details{float:none; width:100%;}
article li .details p{float:none;}
article li .details p em{display:inline-block;}
article li .details p.day{display:block; position:static; width:auto; height:auto; padding:3.733333vw 2.666667vw; text-align:left; font-size:2.933333vw;}
article li .details p.day em{margin:0 2.666667vw 0 0; font-size:3.733333vw;}
article li .details p.day em span{font-size:3.466667vw;}
article li .details p.area{width:100%; margin:0; padding:3.6vw 0 2.933333vw; font-size:3.2vw;}
article li .details p.area em{display:block; margin-bottom:1.333333vw; font-size:3.2vw;}
article li .details a{position:relative; width:40vw; height:9.333333vw; padding:2.933333vw 1.333333vw 2.933333vw 6.666667vw; font-size:3.2vw; transition:auto; background-position:8.666667vw center; background-size:1.866667vw 3.733333vw;}
article li .details a:hover{opacity:1;}
article li .details a:before{content:none;}
aside{float:none; width:100%; margin-left:0;}
aside div{margin-bottom:8vw; padding:4vw 4vw 2.933333vw;}
aside h3{margin-bottom:4vw; padding:5.333333vw 1.333333vw; font-size:4vw;}
aside h3 span{margin-top:1.866667vw; font-size:2.933333vw;}
aside .recommend li + li{margin-top:2.933333vw;}
aside .pr h3{margin-bottom:4.133333vw; padding:4.933333vw 1.333333vw;}
aside .attention{padding:2.933333vw 4vw; font-size:2.666667vw; line-height:1.5;}
aside a img{transition:auto;}
aside a:hover img{opacity:1;}

}