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




.mainContents{max-width: 815px;  border-bottom: none; padding: 0;}
.mainContents > section{border-top: none;}

#scene{box-sizing:content-box;}
#scene #titleArea{width: 950px; margin: 110px auto 0;}
#scene h2{ font-size: 30px; color: #968C5F; border-bottom: #968C5F solid 3px; padding: 65px 0 30px;}
#scene h3{color: #fff; font-size: 23px; background:#968C5F; text-align: left; padding-left: 5px; margin-bottom: 25px;}
#scene h4{color: #968C5F; font-size: 20px; padding: 0 0 2px; border-bottom: 1px solid #968C5F; margin-bottom: 20px;}

#scene .leadimg{display: flex; justify-content: space-between; margin-bottom: 53px;}
#scene .leadimg li{max-width: 380px; text-align: right;}

#scene .lead{font-size: 18px; margin-bottom: 80px;}
#scene .lead .txt{margin: 50px 0 70px;}

#scene .content{text-align: left;}

#scene .box01,
#scene .box02{margin-bottom: 70px;}

#scene .box01 ul,
#scene .box02 ul,
#scene .box03 ul,
#scene .box04 ul{display: flex; justify-content: space-between;}

#scene .box01 ul li,
#scene .box02 ul li,
#scene .box03 ul li{width:calc((100% - 50px) / 2);}

#scene .box03 dl{display: table; width: 100%;}
#scene .box03 dl dt{display: table-cell;}
#scene .box03 dl dd{display: table-cell; text-align: right;}

#scene .box01 dl{display: table; width: 100%;}
#scene .box01 dl dt{display: table-cell; width: 6.3em;}
#scene .box01 dl dd{display: table-cell; font-size: 15px;}

#scene .box03 .img{text-align: right;}
#scene .box04 .img{width: 180px; text-align: right; margin-left: 20px;}

#scene .boxhalf{display: flex; justify-content: space-between;}
#scene .boxhalf li{width:calc((100% - 20px) / 2);}
#scene .box03 ul li{width:calc((100% - 20px) / 2);}

#scene .boxhalf2{display: flex; justify-content: space-between;}
#scene .boxhalf2 .img{width:calc((100% - 20px) / 2); text-align: right;}

/**/
#scene .notice{font-size: 12px;}
#scene .ind{padding-left: 1.5em;}
#scene .ttl{color: #968C5F;}

#scene ul.flexend{display: flex; justify-content: flex-end;}
#scene ul.flexend li{width: 177px; margin: 20px 0 0 45px; text-align: right;}


/**/
.btnlink{ margin: 0 auto 100px; text-align: center;}
.btnlink{ margin: 100px auto 0; text-align: center;}
.btnlink li{ max-width: 420px; margin: 0 auto; position: relative;}
.btnlink li:first-child{margin: 0 auto 30px;}
.btnlink a{background: #968C5F; color: #fff; display: block; line-height: 80px; width: 100%; text-decoration: none;}

.btnlink li::after{content: '>'; color: #fff; position: absolute; right: 50px; top: 30px;}


.btnlink .toi a{ width: 100%; background: #fff; border: 1px solid #968C5F; color: #968C5F; display: block; line-height: 80px; text-decoration: none; }

.btnlink li.toi::after{content: '>'; color: #968C5F; position: absolute; right: 50px; top: 30px;}

.btnlink .aline{margin: 0 10%;}



@media screen and (max-width: 768px) {
.mainContents{padding: 0 20px;}
#scene h2{font-size: 26px; padding: 65px 0 10px;}

#scene #titleArea{width: 100%; margin: 30px auto 0;}

#scene .leadimg{font-size: 12px;}
#scene .leadimg li{max-width: calc((100% - 20px) / 2); text-align: right;}

#scene .img span{font-size: 12px;}

#scene .lead{}
#scene .lead .txt{margin: 50px 0 30px;}

#scene .box01 ul,
#scene .box02 ul,
#scene .box03 ul,
/*#scene .box04 ul,*/
#scene .boxhalf,
#scene .box02 ul .boxhalf{display: block;}
#scene ul.flexend{display: flex; justify-content: space-between;}

#scene .box03 ul ul{display: flex; justify-content: space-between;}

#scene .boxhalf li:first-child{margin: 0 0 50px;}
#scene .boxhalf li li:first-child{margin: 0;}

#scene .box01,
#scene .box02{margin-bottom: 50px;}


#scene .box01 ul li,
#scene .box02 ul li,
#scene .box03 ul li,
#scene .boxhalf li{width:100%;}
#scene ul.flexend li{width:calc((100% - 10px) / 3); margin: 10px 0 0; font-size: 12px;}


.btnlink li::after{content: '>'; color: #fff; position: absolute; right: 30px; top: 30px;}

  
}

