@charset "UTF-8";
@media (max-width: 1000px) {
	.result_suggest_title .result_suggest_list { margin: 0 -1.5rem!important; }
	#site_body	{ overflow: visible; min-width: auto; }
}
.search_feature.active, 
.search_styling.active, 
.result_suggest	{ background-color: #fff; position: relative; z-index: 2; }
search_box	{ z-index: 3; }
.header_caution { height: 48px; }
#contents { width: 100%!important; max-width: 100%!important; padding: 0; margin: 0; }
#pisss { width: 100%!important; max-width: 100%!important; }
#pi { width: 100%!important; max-width: 100%!important; margin: 0; background-color: transparent!important; padding: 0; }
#pi > img { display: none!important; }
@media (min-width: 768px)	{
	.result_suggest_title .result_suggest_list { margin: 0 -1.5rem 0; }
}
.section_main, 
.seach_sort_wrapper,
.search_contents,
.bread	{ background-color: #fff; }
.seach_sort_wrapper,
.search_contents,
.bread,
.store_footer	{ position: relative; z-index: 2; }
.result_suggest	{ margin: 0; }
.pi_description	{ padding: 0!important; background-color: #fff; }
.pi_lgzformat	{ display: -webkit-flex; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; padding: 0; margin: 0; letter-spacing:0; position: relative; container-type: inline-size; }
.pi_lgzformat div	{ letter-spacing:0; }
.pi_lgzformat *	{ letter-spacing:0; font-family: dnp-shuei-gothic-gin-std, sans-serif; font-weight: 400; font-style: normal; font-size:14px; line-height:1.75; -webkit-text-size-adjust:100%; color:#000000; -webkit-font-smoothing: antialiased; font-feature-settings: normal; }
.pi_lgzformat .en	{ font-family: gotham, sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
.pi_lgzformat img, 
.pi_lgzformat picture	{ width: 100%; vertical-align: bottom; line-height: 1;  }
.pi_lgzformat ul:before,
.pi_lgzformat ol:before,
.pi_lgzformat dl:before, 
.pi_lgzformat ul:after, 
.pi_lgzformat ol:after, 
.pi_lgzformat dl:after	{ display: none!important; }
.pi_lgzformat img	{ width: 100%; vertical-align: bottom; line-height: 0; }
.pi_lgzformat .small {font-size:80%;}
.pi_lgzformat .center-text	{ text-align: center; }
.pi_lgzformat_inner	{ width: 100%; display: -webkit-flex; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; z-index: 2; }
.contanc	{ width: 100%; height: 0px; transform: translateY(-48px); }
.pi_lgzformat_bg	{ display: -webkit-flex; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; padding: 0; margin: 0; letter-spacing:0; position: relative; }
@media (max-width: 767.9px)	{ 
	.pi_lgzformat_bg	{ display: -webkit-flex; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; padding: 0; margin: 0; letter-spacing:0; position: relative; }
	.contanc	{ width: 100%; height: 0px; transform: translateY(-70px); }
}

/* ------------ ANIMATION ------------- */
.scrollIn	{ opacity: 0; transition: opacity 1s cubic-bezier(0.215, 0.61, 0.355, 1); }
.scrollIn.active	{ opacity: 1; transition: opacity 1.5s cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transition-delay: .3s; transition-delay: .3s; }
@keyframes fadein	{ 
	from	{ opacity: 0; }
	to	{ opacity: 1; }
}

/* ------------ MAIN AREA -------------  */
.mainimg_wrapper	{ width: 100%; height: 100%; position: relative; display: -webkit-flex; display: flex; align-items: center; justify-content: center; }
.mainimg_wrapper > h1	{ width: 39.58333cqw; position: absolute; left: 10cqw; top: 4.86cqw; line-height: 1; transition: all 1.8s ease; opacity: 0; }
.mainimg_wrapper.active > h1	{ opacity: 1; -webkit-transition-delay: .6s; transition-delay: .6s; }
.mainimg_wrapper > img,
.mainimg_wrapper > picture,
.mainimg_wrapper > picture img	{ transition: opacity 1.8s ease; opacity: 0; }
.mainimg_wrapper.active > img,
.mainimg_wrapper.active > picture,
.mainimg_wrapper.active > picture img	{ opacity: 1; }
@media (min-width: 768px) {
	.mainimg_wrapper > h1	{ transform: translateY(10px); }
	.mainimg_wrapper.active > h1	{ transform: translateY(0); }
}
@media (max-width: 767.9px) {
	.mainimg_wrapper > h1	{ width: 80cqw; top: 22%; left: 50%; transform: translate(-50%,-50%);  }
	.mainimg_wrapper.active > h1	{ top: 18%; }
}

/* ------------ INTRODUCTION -------------  */
.introduction	{ width: 100%; display: -webkit-flex; display: flex; align-items: flex-start; justify-content: center; padding: 3.54cqw 0 4cqw; }
.introduction > p	{ font-size: clamp(12px, 24px, .97cqw); line-height: 2.367; font-weight: 500; text-align: center; }
@media (max-width: 767.9px) {
	.introduction	{ padding: 6.5cqw 6cqw; margin: 0 0 7.5cqw; }
	.introduction > p	{ font-size: 3.7234cqw; line-height: 1.928; text-align: left; }
	.introduction > p br	{ display: none; }
}

/* ------------ NAVI ------------- */
.navigation_wrapper	{ position: -webkit-sticky; position: sticky; top: 54px; left: 0; width: 100%; display: -webkit-flex; display: flex; align-items: center; justify-content: center; z-index: 5; }
.navigation_wrapper > ul	{ display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; list-style: none; }
.navigation_wrapper > ul > li { display: -webkit-flex; display: flex; }
.navigation_wrapper > ul > li:not(:first-child) { border-left: 1px solid #B4B4B4;  }
.navigation_wrapper > ul > li > a { display: -webkit-flex; display: flex; padding: .3cqw 2.8cqw 0; }
.navigation_wrapper > ul > li > a > span	{ color:#000; padding: 0 .4cqw .4cqw; font-size: clamp(12px, 30px, 1.7cqw); line-height: 1.06; font-family: gotham, sans-serif; font-optical-sizing: auto; font-weight: 600; border-bottom: 3px solid transparent; transition: all .5s; }
.navigation_wrapper > ul > li.active > a > span	{ color:#C66868; border-bottom: 3px solid #C66868; }
@media (min-width: 768px) {
	.navigation_wrapper > ul > li > a > span br	{ display: none; }
	.navigation_wrapper > ul > li > a:hover > span	{ border-bottom: 3px solid #C66868; }
}
@media (min-width: 768px) {
	.navigation_left	{ position: -webkit-sticky; position: sticky; top: -100px; left: 0; width: 11.1cqw; min-height: 100vh; order: 1; }
	.navigation_left > ul	{ transform: rotate(90deg); transform-origin:left bottom; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; list-style: none; position: absolute; top: 14cqw; left: 2cqw; }
	.navigation_left > ul > li { display: -webkit-flex; display: flex; }
	.navigation_left > ul > li:not(:first-child) { border-left: 1px solid #B4B4B4; }
	.navigation_left > ul > li > a { display: -webkit-flex; display: flex; padding: .2cqw .8cqw 0; }
	.navigation_left > ul > li > a > span	{ white-space: nowrap; color:#000; padding: 0 .2cqw .2cqw; font-size: clamp(11px, 20px, 1.3cqw); line-height: 1.06; font-family: gotham, sans-serif; font-optical-sizing: auto; font-weight: 600; border-bottom: 2.35px solid transparent; transition: all .5s; }
	.navigation_left > ul > li.active > a > span	{ color:#C66868; border-bottom: 2px solid #C66868; }
	.navigation_left > ul > li > a > span br	{ display: none; }
	.navigation_left > ul > li > a:hover > span	{ border-bottom: 2px solid #C66868; }
	.navigation_right	{ position: -webkit-sticky; position: sticky; top: 0; right: 0; width: 10.2cqw; min-height: 100vh; order: 3; display: -webkit-flex; display: flex; }
	.navigation_right > b	{ width: 100%; height: 100%; position: relative; }
	.navigation_right > b > img	{ position: absolute; top: 17cqw; right: 2cqw; width: 1.33cqw; opacity: 1; }
}
@media (max-width: 767.9px) {
	.navigation_wrapper > ul > li > a { padding: 0 4cqw; }
	.navigation_wrapper > ul > li > a > span	{ padding: 0 1cqw .2cqw; font-size: 4.2cqw; text-align: center; border-bottom: 2px solid transparent; }
	.navigation_wrapper > ul > li.active > a > span	{ color:#C66868; border-bottom: 2px solid #C66868; }
	.navigation_left, 
	.navigation_right	{ display: none; }
}

/* ------------ CONTENTS ------------- */
.contents_wrapper	{ width: 100%; display: -webkit-flex; display: flex; align-items: flex-start; }
.contents_inner	{ width: 100%; display: -webkit-flex; display: flex; flex-direction: column; }
.contents_set	{ width: 100%; display: -webkit-flex; display: flex; flex-direction: column; }
.contents_header	{ width: 100%; display: -webkit-flex; display: flex; align-items: flex-start; justify-content: space-between; margin: 6.6cqw 0 6.3cqw; padding: .8cqw 0 0; border-top: 1px solid #000;  }
.contents_header > b	{ display: -webkit-flex; display: flex; align-items: center; font-family: gotham, sans-serif; font-size: clamp(12px, 30px, 1.2cqw); line-height: 2; font-weight: 600; position: relative; gap: 1.5cqw; }
.contents_header > b::before	{ content:"("; }
.contents_header > b::after	{ content:")"; }
.contents_header > strong	{ font-family: gotham, sans-serif; font-size: clamp(12px, 40px, 2.4cqw); line-height: 1.232; font-weight: 600; text-align: right; }
.item_set_wrapper	{ display: -webkit-flex; display: flex; justify-content: center; flex-wrap: wrap; gap: 3cqw 1.2cqw; margin: 0 0 7.4cqw; }
.item_set	{ width: calc(100% / 3 - .8cqw); display: -webkit-flex; display: flex; flex-direction: column; gap: 1.2cqw; opacity: 0; transition: all 1.5s; transform: translateY(20px); }
.item_set.active	{ opacity: 1; transform: translateY(0);  -webkit-transition-delay: .3s; transition-delay: .3s; }
.item_txt	{ display: -webkit-flex; display: flex; flex-direction: column; gap: 1.4cqw; }
.item_txt > a	{ display: -webkit-flex; display: flex; align-items: flex-end; flex-wrap: wrap; position: relative; padding: 0 8.4cqw 0 0; gap: .6cqw; }
.item_txt > a > strong	{ font-size: clamp(10px, 40px, 1.7cqw); line-height: 1; transition: all .5s; }
.item_txt > a > b	{ font-size: clamp(6px, 40px, 1cqw); line-height: 1; padding: 0 0 .2cqw; transition: all .5s; }
.item_txt > a > p	{ width: 6.4cqw; display: -webkit-flex; display: flex; align-items: center; background-color: #C66868; border-radius: .16cqw; line-height: 1; position: absolute; top: .3cqw; right: 0; }
.item_txt > a > p > span	{ color:#fff;  font-size: clamp(2px, 20px, .76cqw); line-height: 1; font-weight: 900; width: 100%; padding: .3cqw .8cqw; position: relative; }
.item_txt > a > p > span::before,
.item_txt > a > p > span::after	{ content: ""; position: absolute; top: calc(50% - 1px); right: .6cqw; width: .42cqw; height: .1cqw; border-radius: 99px; background-color: #ffffff; transform-origin: calc(100% - 1px) 50%; transition: all .5s; }
.item_txt > a > p > span::before	{ transform: rotate(30deg); }
.item_txt > a > p > span::after	{ transform: rotate(-30deg); }
.item_txt > a > strong, 
.item_txt > a > b, 
.item_txt > a > p > span	{ font-family: gotham, sans-serif; font-weight: 600; white-space: nowrap; }
@media (min-width: 768px) {
	.contents_inner	{ width: 78.7cqw; order: 2; }
	.contents_header > strong br	{ display: none; }
	.col2 .item_set	{ width: calc(100% / 3 - .79cqw); }
	.item_set.active	{ -webkit-transition-delay: .3s; transition-delay: .3s; }
	.item_set:nth-child(2).active	{ -webkit-transition-delay: .5s; transition-delay: .5s; }
	.item_set:nth-child(3).active	{ -webkit-transition-delay: .7s; transition-delay: .7s; }

	.col2 .item_set:nth-child(3).active	{ -webkit-transition-delay: .3s; transition-delay: .3s; }
	.col2 .item_set:nth-child(4).active	{ -webkit-transition-delay: .5s; transition-delay: .5s; }
	.item_txt > a:hover > strong	{ color:#C66868; }
	.item_txt > a:hover > b	{ color:#C66868; }
	.item_txt > a:hover > p > span::before,
	.item_txt > a:hover > p > span::after	{ right: .3cqw; }
}
@media (max-width: 767.9px) {
	.contents_wrapper	{ margin: 0 0 12cqw;  }
	.contents_inner	{ align-items: center; }
	.contents_set	{ align-items: center; }
	.contents_header	{ width: 90%; margin: 9cqw 0 11cqw; padding: 3cqw 0 0; }
	.contents_header > b	{ font-size: 3.45cqw; line-height: 1.6; gap: 4.5cqw; }
	.contents_header > strong	{ font-size: 6.648cqw; }
	.item_set_wrapper	{ width: 100%; flex-direction: column; align-items: center; gap: 14cqw 0; margin: 0 0 7.4cqw; }
	.item_set	{ width: 82cqw; gap: 5cqw 0; }
	.item_set.left	{ align-self: start; }
	.item_set.right	{ align-self: end; }
	.item_txt	{ gap: 3cqw; }
	.left .item_txt	{ padding-left: 4cqw; }
	.right .item_txt	{ padding-right: 4cqw; }
	.item_txt > a	{ padding: 0 27cqw 0 0; gap: 1cqw 2.6cqw; }
	.item_txt > a > strong	{ font-size: 4.787cqw; }
	.item_txt > a > b	{ font-size: 3.457cqw; padding: 0 0 .8cqw; }
	.item_txt > a > p	{ width: 24.8cqw; border-radius: 1cqw; absolute; top: -.6cqw; right: 0; }
	.item_txt > a > p > span	{ font-size: 3cqw; padding: 1.3cqw 2.6cqw; position: relative; }
	.item_txt > a > p > span::before,
	.item_txt > a > p > span::after	{ right: 2cqw; width: 1.4cqw; height: .39cqw; }
	.item_txt > a > p > span::before	{ transform: rotate(53deg); }
	.item_txt > a > p > span::after	{ transform: rotate(-53deg); }
}

/* ------------ BLOCK ------------- */
@media (min-width: 768px)	{ .pconly { display: block; } }
@media (max-width: 767px)	{ .sponly { display: block; } }
@media (min-width: 768px)	{ .sponly { display: none!important; } }
@media (max-width: 767px)	{ .pconly { display: none!important; } }

.no-transition * {
  transition: none !important;
}
