/** help/faq CSS **/

.mo_{display: none !important;}

.main_visual {position:relative; }
.main_visual .visual_title {position:absolute; left:50%; top:52%; transform:translate(-50%,-50%);}
.main_visual .visual_title span {display:block; margin:0 0 2vw; color:#FFF; font-size:1.2vw; text-align:center;}
.main_visual .visual_title svg {fill:#FFF;}

.main_visual.sub .sub_visual_frame {position:relative; overflow:hidden;width:100%; height:32.59vw;}
.main_visual.sub .sub_visual_frame > div {height:100%;}
.main_visual.sub .sub_visual_frame img {width:100%; height: 100%;}
.main_visual.sub .visual_title > h2 {margin:0 0 1.5vw; font-size:34px; color:#FFF; text-align:center;}
.main_visual.sub .visual_title > span {font-size:0.9vw; }

.center-title {padding:0 12vw;}
.center-title h2 { text-align:center; font-family: 'ChosunSm';} 
.center-title p {text-align:center; font-family: 'Pretendard'; font-weight:300;}
.center-title span {display:block; text-align:center; font-family: "Crimson"; color:#beb9b4 !important; }
.center-title.L h2 {font-size:2.5vw; line-height:1.7; }
.center-title.L p {margin:2vw 0 0; font-size:0.9vw; line-height:1.7; }
.center-title.S h2 {font-size:1.7vw; line-height:1.7; }
.center-title.S p {margin:2vw 0 0; font-size:0.9vw; line-height:1.5;}
.center-title.SS h2 {margin:1.3vw 0 0; font-size:1.4vw; }
.center-title.SS span {font-size:0.8vw; line-height:1.5; letter-spacing:0.4px;}


.faq_select {display:flex; flex-flow:row nowrap; justify-content:center; gap:38px; align-items:center;  padding:37px 0; background:#222426;}
.faq_select span {color:#FFF;}
.faq_select select {width: 400px; height: 52px; text-align:center;  border:1px solid #FFF; color:#FFF; background:none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.faq_select select option {color:#222426;}
.faq_select select:focus {outline:none;}
.faq_select .faq_input_select{position:relative;}
.faq_select .faq_input_select:after{content:''; display:block; position:absolute; top: 50%; right:30px; margin-top:-8px; width: 8px; height: 8px;  border:solid 1px; border-color:transparent transparent #fff #fff; transform:rotate(-45deg)}

#ovenpot2_faq {padding: 74px 0 100px; margin: 0 auto;}
#ovenpot2_faq .center-title.SS h2{margin: 0 0 95px; font-size: 26px;}

#ovenpot2_faq .flex_box {display:flex; flex-flow:row nowrap; justify-content:space-between; width:1080px; margin:3vw auto; }
#ovenpot2_faq .flex_box .left {width:200px; min-width:200px;}
#ovenpot2_faq .flex_box .left ul li {color:#dcdcdc; border-bottom:1px solid #dcdcdc; padding: 18px 0; cursor:pointer;}
#ovenpot2_faq .flex_box .left ul li:first-child {border-top:1px solid #dcdcdc;}
#ovenpot2_faq .flex_box .left ul li.active {color:#222426; position:relative; padding: 18px 0 18px 15px;}
#ovenpot2_faq .flex_box .left ul li.active:after{content:'';display:block; position:absolute; top:0; bottom:0; left:0; margin: auto 0; width:0; height:0; border-style:solid; border-width: 4px 0 4px 4px; border-color:transparent transparent transparent #222426;}
#ovenpot2_faq .flex_box .right {width:800px; max-width:800px;}
#ovenpot2_faq .flex_box .right > div {display:none;}
#ovenpot2_faq .flex_box .right > div:first-of-type {display:block;}
#ovenpot2_faq .flex_box .right .caption {font-weight:bold; margin:0 0 13px; }
#ovenpot2_faq .flex_box .right ul {}
#ovenpot2_faq .flex_box .right ul li {}
#ovenpot2_faq .flex_box .right ul li > div {padding:23px 35px;}
#ovenpot2_faq .flex_box .right ul li .faq_title{position:relative; display:flex; align-items:center; gap:20px; border-bottom:1px solid #dcdcdc; font-size:14px; cursor:pointer;}
#ovenpot2_faq .flex_box .right ul li:first-child .faq_title {border-top:1px solid #dcdcdc;}
#ovenpot2_faq .flex_box .right ul li .faq_title span {display:inline-block; width:19px; height:19px; min-width:19px; font-size:0; background:url('/img/2024/help/faq/faq_icon01.svg')no-repeat center; }
#ovenpot2_faq .flex_box .right ul li .faq_title:after {content:''; display:block; position:absolute; top:50%; right:30px; margin-top:-5px; width:15px; height:10px; background:url('/img/2024/help/faq/faq_icon03.png') no-repeat center; background-size:contain;}
#ovenpot2_faq .flex_box .right ul li .faq_ans {overflow:hidden; height:0;  background:#eceeef; padding:0; opacity:0; transition: all 0.4s; font-size: 14px;}
#ovenpot2_faq .flex_box .right ul li .faq_ans > div {display:flex; gap:20px;padding: 40px 35px;}
#ovenpot2_faq .flex_box .right ul li .faq_ans span {display:inline-block; width:19px; height:19px; min-width:19px; font-size:0; background:url('/img/2024/help/faq/faq_icon02.svg')no-repeat center; }
#ovenpot2_faq .flex_box .right ul li .faq_ans p { line-height:1.3;}

#ovenpot2_faq .flex_box .right ul li.active .faq_title:after{transform: rotate(180deg);}
#ovenpot2_faq .flex_box .right ul li.active .faq_ans  {height:100%; opacity:1;}
#ovenpot2_faq .c-btn {margin:80px auto 0;}
#ovenpot2_faq .c-btn .btn_inner{font-size:14px;}


.ex_link {
	display: inline-block;
	padding-right: 18px;
	background: url("../../../../../common/img/ex_icon_red.png") no-repeat right center;
	background-size: 10px 8px
}

.ex_link.black {
	background: url("../../../../../common/img/ex_icon_black.png") no-repeat right center
}

.ex_link.white {
	background: url("../../../../../common/img/ex_icon_white.png") no-repeat right 10px top 5px !important;
}

.c-btn {text-align: center;}
.c-btn > * {color: #222426;position: relative;width: 100%;height: 100%;display: block;box-sizing: border-box;transition: color 0.5s cubic-bezier(0.23, 1, 0.32, 1);}
.c-btn > *:before,.c-btn > *:after {content: "";display: block;top: 0;left: 0;height: 100%;width: 100%;-webkit-transform-origin: center;transform-origin: center;box-sizing: inherit;position: absolute;transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);transform: scale3d(1, 1, 1);}
.c-btn > *:before {border-top: 1px solid #222426;border-bottom: 1px solid #222426;}
.c-btn > *:after {border-left: 1px solid #222426;border-right: 1px solid #222426;}
.c-btn.type-jp * {font-family: 'Nanum Myeongjo', serif;}
.c-btn.type-en * {font-family: "Crimson", serif;font-style: italic;}
.c-btn.type-center {margin-left: auto;margin-right: auto;}
.c-btn .c-link-blank::before,.c-btn .c-link-blank::after {border-color: currentColor;}

.c-btn {width: 200px;height: 40px;line-height: 40px;}
	.c-btn.w220 {width: 220px;}
	.c-btn.w280 {width: 280px;}
	.c-btn.w300 {width: 300px;}
	.c-btn * {font-size: 13px;}
	.c-btn .c-link-blank {width: 10px;height: 8px;margin-left: 5px;}
	.c-btn.type-en * {font-size: 15px;}
	.c-btn.type-pc-white > * {color: #fff;}
	.c-btn.type-pc-white > *:before {border-top: 1px solid #fff;border-bottom: 1px solid #fff;}
	.c-btn.type-pc-white > *:after {border-left: 1px solid #fff;border-right: 1px solid #fff;}
	.c-btn.type-pc-black > * {color: #222426;}
	.c-btn.type-pc-black > *:before {border-top: 1px solid #222426;border-bottom: 1px solid #222426;}
	.c-btn.type-pc-black > *:after {border-left: 1px solid #222426;border-right: 1px solid #222426;}
	.c-btn__list {display: flex;justify-content: center;align-items: center;}
	.c-btn__list > * {margin-left: 30px;}
	.c-btn__list > *:first-child {margin-left: 0;}
	.c-btn:hover > *:before {transform: scale3d(0, 1, 1);}
	.c-btn:hover > *:after {transform: scale3d(1, 0, 1);}


@media screen and (max-width:750px){
	.pc_ {display: none !important;}
	.mo_ {display: block !important;}
	.main_visual .fade_slider_wrap {height:100vh;}
	.main_visual .slick-list, .main_visual .slick-track {height:100%;}
	.main_visual .fade_slider_wrap .slick-slide img {width:100%; height:100%; object-fit:cover;}
	.main_visual .visual_title {top:50%;}
	.main_visual .visual_title span {font-size:4.2vw;}
	.main_visual .visual_title svg {width:66vw;}
	.wrapper.faq .main_visual .sub_visual_frame {height: 66.66667vw;}
	.wrapper.faq .main_visual.sub .visual_title {top:34.5vw;}
	.wrapper.faq .main_visual.sub .visual_title > h2 {margin:0; font-size:7.2vw;}
	.wrapper.faq .main_visual.sub .visual_title > span {font-size:2.7vw;}
	
	.faq_select{padding: 20px 25px 30px; flex-flow:column nowrap; justify-content:left; align-items:inherit; gap:8px;}
	.faq_select select{width:100%; height:52px;}
	.faq_select span {font-size: 14px; line-height:1.67;}
	.faq_select .faq_input_select:after{right:5.5vw; }
	.faq_select .faq_input_select.select_b:after{border-color: transparent transparent #222426 #222426;}
	#ovenpot2_faq {padding: 0; }
	#ovenpot2_faq .center-title{padding:0;}
	#ovenpot2_faq .center-title.SS h2 {margin: 30px 0 34px 0; font-size: 19px; line-height: 1.67;}
	#ovenpot2_faq .flex_box{flex-flow:column nowrap; width:100%; margin:0 auto;}
	#ovenpot2_faq .flex_box .right{width:100%;}
	#ovenpot2_faq .flex_box .right .caption {margin: 45px 25px 10px; line-height:1.67; font-size:14px;}
	#ovenpot2_faq .flex_box .right > div {display: block;}
	#ovenpot2_faq .flex_box .right ul li > div {padding:0;}
	#ovenpot2_faq .flex_box .right ul li .faq_title {margin: 0 25px; gap:0; padding:20px 0; font-size:14px; line-height:1.67;}
	#ovenpot2_faq .flex_box .right ul li .faq_title span {width:15px; height:15px; min-width:15px; background-size:100%; margin-right:10px;}
	#ovenpot2_faq .flex_box .right ul li .faq_title:after{top:auto; right:6px; width: 14px;}
	#ovenpot2_faq .flex_box .right ul li .faq_ans > div {padding: 25px; gap:0; font-size:14px;}
	#ovenpot2_faq .flex_box .right ul li .faq_ans span {width:15px; height:15px; min-width:15px; background-size:100%; margin-right:10px;}

	#ovenpot2_faq .btn {margin: 49px 25px 0; width:auto;}
	#ovenpot2_faq .btn>*{height:55px; line-height:55px;}

	.faq_select.mo_ {background:#ffffff; padding: 0 25px;}
	.faq_select.mo_ select{border: solid 1px #222426; color:#222426;}
	
}
