@charset "UTF-8";
@font-face {
  font-family: 'NeueHaas';
  src: url('font/NeueHaasDisplayRoman.woff') format('woff'),
       url('font/NeueHaasDisplayRoman.woff2') format('woff2'),
       url('font/NeueHaasDisplayRoman.ttf') format('truetype');
}

#pi { width: 100%!important; max-width: 980px; }
/* #pi > img { display: none!important; } */
.pi_description	{ padding: 0!important; }
.pi_lgzformat	{ display: block; width: 100%; padding: 0; margin: 0 0 100px; }
.pi_lgzformat *	{ font-family: "NeueHaas","Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; }
.pi_lgzformat a { transition: all .3s; color:#000000; }
.pi_lgzformat a:hover {opacity:0.7; color:#000000; text-decoration:none;}
.pi_lgzformat .small {font-size:80%;}
.pi_lgzformat img	{ width: 100%; line-height: 1; }
@media (orientation: portrait) and (max-width: 829px)	{ 
	.pi_lgzformat	{ margin: 0 0 60px; }
}

/* ------------ FADEIN ------------- */
.invitem	{ opacity : 0; transform : translate(0, 40px); transition: all .8s; }
.invitem.inview	{ opacity : 1; transform : translate(0, 0); }
.delay01	{ transition-delay: .1s; }
.delay02	{ transition-delay: .2s; }
.delay03	{ transition-delay: .3s; }
.delay04	{ transition-delay: .4s; }
.delay05	{ transition-delay: .5s; }
.delay06	{ transition-delay: .6s; }
.delay07	{ transition-delay: .7s; }
.delay08	{ transition-delay: .8s; }

/* ------------ INTRODUCTION ------------- */
.introduction	{ text-align: center; padding: 60px 0 0; background-color: #fff; }
.introduction > h1	{ color:#000000; font-size: 11px; font-weight: 700; line-height: 1.4; padding: 0 0 20px; }
.introduction > h2	{ color:#000000; font-size: 24px; font-weight: 700; line-height: 1.4; padding: 0 0 20px; }
.introduction > h2.underline	{ font-size: 28px; font-weight: 700; line-height: 1.4; padding: 0; margin: 0 0 60px; position: relative; letter-spacing:.05rem; }
.introduction > h2.underline::before	{ content:""; position: absolute; bottom: -15px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 0px; height: 4px; border-radius: 5px; background-color: #000; transition: all .6s; opacity: 0; }
.introduction > h2.underline.inview::before	{ width: 200px; opacity: 1; }
.introduction > p	{ color:#0A1317; font-size: 13.8px; font-weight: 400; line-height: 3em; }
@media (orientation: portrait) and (max-width: 829px)	{ 
	.introduction	{ padding: 30px 20px 0; }
	.introduction > h1	{ font-size: 11px; padding: 0 0 15px; }
	.introduction > h2	{ font-size: 18px; padding: 0 0 10px; }
	.introduction > p	{ font-size: 12px; line-height: 2.2; }
}
@media screen and (max-width: 639px) {
	.introduction > h2.underline	{ font-size: 20px; margin: 0 0 40px; }
	.introduction > h2.underline.inview::before	{ width: 100px; }
}

.pi_lgzformat .genreset	{ padding: 30px 20px 0; text-align:center; max-width: 1000px; margin: 0 auto;}
.pi_lgzformat h3	{ font-size:20px; font-weight: 500; line-height:1.5; letter-spacing: .05em; margin: 0 0 20px; }
.pi_lgzformat h3 span	{ font-size:40px; line-height: 1; font-weight: 500;}
.pi_lgzformat p	{  font-size: 13.8px; text-align:left; line-height: 1.75;}
@media screen and (max-width: 639px) {
	.pi_lgzformat .genreset	{ padding:20px 20px 0; }
	.pi_lgzformat h3	{ font-size:18px; margin-bottom: 10px; }
	.pi_lgzformat h3 span	{ font-size:28px; }
	.pi_lgzformat p	{ font-size: 12px; }
}

.head-border	{ display: flex; align-items: center; }
.head-border:before,
.head-border:after	{ content: ""; height: 1px; flex-grow: 1; background-color: #666; }
.head-border:before	{ margin-right: 1rem; }
.head-border:after	{ margin-left: 1rem; }

.btnset	{ padding: 0; margin: 0; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: center; }
.btnset > li	{ width: calc(100%/4 - 10px); padding: 0; margin: 0 12px 10px 0; position: relative; }
.btnset.colm3 > li	{ width: calc(100%/3 - 10px); padding: 0; margin: 0 12px 10px 0; }
.btnset > li:nth-child(4n)	{ margin: 0 0 10px; }
.btnset.colm3 > li:nth-child(4n)	{ margin: 0 12px 10px 0; }
.btnset.colm3 > li:nth-child(3n)	{ margin: 0 0 10px; }
.btnset > li > a	{ background-color: #000; display: -webkit-flex; display: flex; justify-content: center; align-items: center; padding: 10px 20px; margin: 0; text-align: center; border: 1px solid #000; height:100%; min-height:60px; transition: all .5s; position: relative; border-radius: 2px; box-sizing: border-box; }
.btnset > li > a:hover	{ opacity:.6; }
.btnset > li > a > span	{ color:#ffffff; font-size: 15px; font-weight: 700; line-height: 1.2; letter-spacing:.05rem; }
.arrow_right::before	{ content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 10px; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); }
@media screen and (max-width: 639px) {
	.btnset	{ justify-content: space-between; }
	.btnset > li, 
	.btnset.colm3 > li	{ width: calc(100%/2 - 6px); }
	.btnset > li:nth-child(2n), 
	.btnset > li:nth-child(4n), 
	.btnset.colm3 > li:nth-child(3n), 
	.btnset.colm3 > li:nth-child(4n)	{ margin: 0 0 12px; }
	.btnset > li > a	{ padding: 5px 18px; min-height:46px; }
	.btnset > li > a > span	{ font-size: 12px; }
	.arrow_right::before	{ right: 8px; }
}
@media screen and (max-width: 374px) {
	.btnset > li > a	{ padding: 5px 10px; min-height:40px; }
	.btnset > li > a > span	{ font-size: 10px; }
	.btnset .arrow_right::before	{ border-top: 1px solid #fff; border-right: 1px solid #fff; right: 5px; width: 5px; height: 5px; }
}

/* ------------ ボタン00 ------------- */
.btnset > li.btc_00 > a	{ background-color: #fff; border: 1px solid #000; }
.btnset > li.btc_00 > a > span	{ color:#000; }
.btnset > li.btc_00 .arrow_right::before	{ border-top: 2px solid #000; border-right: 2px solid #000; }
@media screen and (max-width: 374px) {
	.btnset > li.btc_00 .arrow_right::before	{ border-top: 1px solid #000; border-right: 1px solid #000; }
}

/* ------------ ボタン01 ------------- */
.btnset > li.btc_01 > a	{ background-color: #000; border: 1px solid #000; }

/* ------------ ボタン02 ------------- */
.btnset > li.btc_02 > a	{ background-color: #898989; border: 1px solid #898989; }

/* ------------ ボタン03 ------------- */
.btnset > li.btc_03 > a	{ background-color: #88705e; border: 1px solid #88705e; }

/* ------------ ボタン04 ------------- */
.btnset > li.btc_04 > a	{ background-color: #9c5e78; border: 1px solid #9c5e78; }

/* ------------ ボタン05 ------------- */
.btnset > li.btc_05 > a	{ background-color: #4b5b7b; border: 1px solid #4b5b7b; }


ul.colset::before,
ul.colset::after	{ display: none; }
.colset	{ display: -webkit-flex; display: flex; justify-content: space-between; margin: 0 0 60px; }
.col2 > li	{ width: calc(50% - 5%); }
.col3 > li	{ width: calc(100% / 3 - 2%); }
.col2 > li > p	{ display: block; width: 100%; padding: 10px 0 0; margin: 0 0 10px; }
@media screen and (max-width: 639px) {
	.colset	{ flex-wrap: wrap; margin: 0 0 30px; }
	.col2 > li	{ width: 100%; }
	.col3 > li	{ width: 100%; padding: 0 0 20px; }
	.col2 > li > p	{ margin: 0 0 30px; }
}
.btmbtn	{ display: -webkit-flex; display: flex; align-items: center; justify-content: center; padding: 0 20px; }
.btmbtn > a	{ width: 100%; max-width: 600px; padding: 20px; background-color: #808487; border-radius: 3px; color:#fff; text-align: center; font-size: 16px; font-weight: 700; letter-spacing:.05rem; line-height: 1; transition: all .3s; }
.btmbtn > a:hover	{ background-color: #b0b9bd; color:#26373e; }
@media screen and (max-width: 639px) {
	.btmbtn > a	{ font-size: 14px; }
}

.genreset > h3	{ width: 100%; display: -webkit-flex; display: flex; align-items: center; justify-content: center; padding: 0 0 20px; }
.genreset > h3 > span	{ font-size: 26px; font-weight: 700; letter-spacing:.05rem; line-height: 1; padding: 0 0 6px; border-bottom: 3px solid #000; }
@media screen and (max-width: 639px) {
	.genreset > h3 > span	{ font-size: 18px; border-bottom: 2px solid #000; }
}


/* ------------ BLOCK ------------- */
@media (max-width: 767px)	{ .pconly { display: none!important; } }
@media (min-width: 768px)	{ .pconly { display: inline-block; } }
@media (max-width: 767px)	{ .sponly { display: inline-block; } }
@media (min-width: 768px)	{ .sponly { display: none!important; } }