@charset "utf-8";
/*==============================================
COMMON
============================================= */
html { overflow: auto; }
body {overflow: hidden; min-width: 960px; }
#header {border-bottom: #ededed solid 1px;}
.headerIn, .footerIn { width: 960px; margin: 0 auto;}


#mainContents {color: #1e1e1e;letter-spacing: 0.10em;}
.pageTop {border-radius: 50%;}
.sp {display: none;}
.mainTitle-sub {padding: 40px 0;text-align: center;}
.mainTitle {position: relative;width: 960px;margin: 60px auto;display:flex;flex-wrap: wrap;}
.mainTitle .h1 {width: 100%;}
.mainTitle h1 {display: block;width: 577px;height: 172px;background: url(../img/h1.png) no-repeat 0 0;text-indent: -999em;font-size: 0;}
.mainTitle .img {position: absolute;top: -60px;right: -24px;}
.mainTitle .img img {width: 380px;}

/*==============================================
BNR
============================================= */
.bnrWrap { position: relative;background: url(../img/bnr_bg.png) no-repeat center center, #062432;}
.bnr {display: block;position: relative;width: 920px;height: 320px;margin: 0 auto;}
.btnTxt {margin-top: 40px;font-size: 14px !important;}
.bnrWrap .btnTxt {padding-top: 110px;color: #fff;}
.btnBox {display: flex;justify-content: center;width: 575px;margin-top: 30px;padding-top:220px}
.btn {font-weight:700;position: relative;display: block;width: 280px;height: 65px;line-height: 60px;border-radius: 30px;text-align: center;color: #fff;font-size: 18px;box-sizing: border-box;transition: .2s;}
.mainTitle .btn {height: 60px;line-height: 58px;margin-right: 10px;font-size: 18px;}
.btn, .btn:visited, .btn:hover {color: #fff;}
.btn.active {border: 1px solid #10ab1d;background-color: #11b71f;}
.btn.active:hover,a:hover .btn.active {background-color: #10ab1d;}
.btn.classic {background-color: #8f7769;border: 1px solid #148eb3;}
.btn.classic:hover,a:hover .btn.classic {background-color: #756156;}
.btn::after {content: "";position: absolute;top: 0;bottom: 0;right: 20px;width: 8px;height: 8px;margin: auto 0;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg);}

/*==============================================
INDEX
============================================= */
.indexWrap {margin-top: 40px;padding: 50px 0;background: url(../img/bkg.jpg);background-size: cover;}
.indexWrap .in {display: flex;width: 600px;margin: 0 auto;}
.indexWrap .in p {width: 160px;}
.indexWrap .in p img {margin-top: 10px;}
.indexWrap .in ul {text-align: left;}
.indexWrap .in ul li a {display: block;position: relative;line-height: 2.2;padding-left: 35px;color: #fff;font-size: 16.5px;box-sizing: border-box;transition: .2s;margin-left: 30px;}
.indexWrap .in ul li a::before {content: "";position: absolute;top: 10px;left: 0;width: 20px;height: 20px;border-radius: 50%;background-color: #1a6e90;transition: .2s;}
.indexWrap .in ul li a::after {content: "";position: absolute;top: 16px;left: 7px;width: 4px;height: 4px;border-top: 2px solid #fff;border-right: 2px solid #fff;-webkit-transform: rotate(135deg);transform: rotate(135deg);}
.indexWrap .in ul li a:hover {color: #eee;text-decoration: underline;}
.indexWrap .in ul li a:hover::before {background-color: #fff;}
.indexWrap .in ul li a:hover::after { border-color: #0082c8;}

/*==============================================
CONTENT 
============================================= */
.content {padding: 60px 0 80px 0;} 
.contentIn {width: 920px;margin: 0 auto;}
.content h2::before {content: attr(data-en);display: block;color: rgba(20,142,179,.25);font-size: 60px;font-style: italic;text-transform: uppercase;font-weight:  700;font-family: 'Noto Serif JP', serif;margin-bottom: 10px;}
.content .sectionImage {width: 180px;margin: 20px auto}
.content h3 {margin-top: 60px;font-size: 22px;text-align: left;}
.content p {line-height: 2;margin: 0 auto;text-align: left;font-size: 18.5px;font-weight:450}
.content p + p {padding-top: 1.85em;}