
/* 문의하기 */
#section .btn_right{
    max-width: 100%;
    background-color: #F4F7FA;
    /*padding: 17px 0;*/
    display: grid;
    justify-content: flex-end;
}
#section .btn_right .btn_right_inner{
    max-width: 1400px;
    margin:0 auto;
    padding: 0 38px;
}
#section .btn_right .btn_right_inner .btn_right_cover{
	position:relative;
	float: right;
	margin-right: 10px;
}
#section .btn_right .btn_right_cover > .btn_width {
    display: block;
    color: #274395;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    padding: 10px 20px;
    border: 4px solid #FFEEBF;
    background-color: #FFCE00;
    border-radius: 29px;
    width: 100%;
    cursor: pointer;
    position: fixed;
    top: 83px;
    width: 131px;
    right: 30px;
    z-index: 10;
}
#section .btn_right .btn_width span.close_btn{
	display:none;
	float:right;
	/*position:relative;*/
	width:20px;
	height: 20px;
	cursor:pointer;
}
#section .btn_right .btn_width i{
    margin-right: 5px;
}
#section .search_text_in .search_input_style{
	position:relative;
}
#section .search_text_in{
	display:none;
	width: 335px;
    padding: 20px;
    background-color: #fff;
    position: fixed;
    right: 32px;
    top: 128px;
    border-radius: 0 0 29px 29px;
    border: 1px solid #fff;
    box-shadow: 0px 10px 15px 1px rgb(0 0 0 / 10%);
    z-index: 10;
}
#section .search_text_in input[type="text"]{
	width:100%;
	border:2px solid #EFEFEF;
	border-radius: 10px;
	background-color: #F5F5F5;
	padding: 10px 20px;
}
/* btn 버튼 */
@{
	width:340px;
	border-radius: 29px 29px 0 0;
}
#section .search_text_in .search_input_style i{
	position:absolute;
	right:20px;
	top:15px;
	color: #CCCCCC;
	font-size:16px;
	cursor:pointer;
}
#section .btn_right .btn_right_cover.active .btn_width span.close_btn{
	display:block;
}
#section .btn_right .btn_right_cover.active .btn_width span.close_btn::after{
	content:"";
	position:absolute;
	display:block;
	width: 14px;
	height:2px;
	background-color: #fff;
	right: 0;
	top: 10px;
	cursor:pointer;
}
#section .btn_right .btn_right_cover.active > .btn_width{
	cursor: auto;
}
/* 검색결과 */
#section .search_this .search_title{
	padding: 10px 5px;
	border-bottom: 1px solid #DDDDDD;
	color:#333;
}
#section .search_this .search_content{
	padding-top: 10px;
	max-height: 200px;
	overflow: auto;
}
*#inquiryResult{list-style-type: disc; padding-left: 20px; color:#333;}
#section .search_next{
	width:100%;
}
#section .search_next a{
	float:right;
	color: #D8D8D8;
	font-size: 14px;
}
#section .search_content ul li a{
	color: #333;
	text-align:left;
}

/* 공통 */
#section .top_container, #section .center_container, #section .bottom_container{
    width:100%;
    clear: both;
}
#section .top_container .top_container_inner,
#section .center_container .center_container_inner,
#section .bottom_container .bottom_container_inner{
    max-width: 1400px;
    margin: 0 auto;
    padding: 12.5px 38px;
    font-size: 1em !important;
}
 #section .bottom_container .bottom_container_inner{
 	padding: 30px;
 }
.left_content, .left_content1{
    border-radius: 8px;
    background-color: #fff;
    padding: 12px 12px;
    box-shadow: 0 0 18px 0 rgb(0,0,0,0.08);
}
.left_content{box-shadow:none;}
.right_content{
    border-radius: 8px;
    background-color: #fff;
    padding: 12px 12px;
}
.title{
    width: 100%;
    border-radius: 8px;
    background-color: #274395;
    color: #fff;
    text-align: left;
    padding: 15px 20px;
}
.title h3{
	font-weight: bold;
    font-size: 17px;
    color: #fff;
}
.content{
    padding: 0 10px;
}
.content li{
    width: 100%;
    border-bottom: 1px solid #EEEEEE;
    clear: both;
    line-height: 4;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.content li a{
    font-size: 14px !important;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color:#333333;
}
.content li span{
    color: #6c6c6c;
    font-size: 0.750em !important;
    font-weight: 200 !important;
    vertical-align: middle;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: right;
}
.btnA{
    width: 100%;
    text-align: center;
    padding: 30px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btnA a{
    color:#274395 !important;
    padding: 10px 22px;
    background-color: #FFCE00;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 700 !important;
    color: #fff;    
}
.btnA a:hover{
	background: #ffeebf;
	color: #FFCE00;
	transition: .3s ease-in;
}

/* top content */
#section .main_top{padding-top: 74px;}
#section .main_top .content span{overflow: initial;}
#section .top_container .top_container_inner{padding: 0 30px; display: flex; justify-content: space-between;}
#section .top_container .top_container_inner .left_content, #section .top_container .top_container_inner .right_content{
    width: calc((100% - 30px)/2);
    height: 500px;
    min-height:450.3px;
    box-shadow: 0 0 18px 0 rgb(0,0,0,0.08);
}

.top_container .ywca_docu{
	width: 100%;
	height: fit-content;
	max-height: 500px;
	border-radius: 8px;
    background-color: #fff;
    padding: 12px 12px;
    box-shadow: 0 0 18px 0 rgb(0 0 0 / 8%);
}

/* center content */
#section .center_container .center_container_inner{padding: 30px;}
#section .center_container .center_container_inner .left_content{
    width: 100%;
    background-color: transparent;
    border-radius: 0;
    padding: 0;
}
#section .center_container .center_container_inner .left_top ul{
	display: flex;
}
#section .center_container .center_container_inner .left_top li{
	height: 115px;
    border-radius: 8px;
    background-color: #fff;
    width: calc((100% - 60px)/3);
    margin-left: 30px;
    padding: 22px 25px;
    box-shadow: 0 0 18px 0 rgb(0 0 0 / 8%);
    position: relative;
}
#section .center_container .center_container_inner .left_top li:first-child{
    margin-left: 0;
}
#section .center_container .center_container_inner .left_top li:last-child dl{justify-content: flex-end;}
#section .center_container .center_container_inner .left_top li dl{
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}
#section .center_container .center_container_inner dt{
	width: 100%;
    font-size: 13px !important;
    color: #6c6c6c;
    font-weight: 500;
/*     font-weight: 300 !important; */
}
#section .center_container .center_container_inner .left_top li dl dd{
    margin:0;
/*     margin-top: 18px; */
    font-size: 17px !important;
    color: #333333;
    font-weight: 700 !important;
    line-height: 45px;
}
#section .center_container .center_container_inner dd.right{
    margin-top: 0;
/*     position: absolute; */
/*     top: 50%; */
/*     right: 0; */
/*     transform: translateY(-50%); */
}
#section .center_container .center_container_inner dd.right a{
    color: #FFCE00;
    border-radius: 50%;
    background-color: #ffeebf;
    
    width: 45px;
    height: 45px;
    padding: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#section .center_container .center_container_inner .left_top li dl dd span.med{
    font-size: 0.875em !important;
    color: #6c6c6c;
    font-weight: 300 !important;
    margin-left:10px;
}
#section .center_container .center_container_inner .left_bottom{
    clear: both;
    background-color: #fff;
    border-radius: 8px;
    background-color: #fff;
    padding: 12px 12px;
    margin-top: 25px;
}
#section .center_container .center_container_inner .right_content{
    width: 37%;
    height: 586px;
}
#section .center_container .center_container_inner .right_content .btnA{
    text-align: right;
}

/* bottom content */
#section .bottom_container .bottom_container_inner .left_content{
    width: 37%;
    height: 468px;
}

#section .bottom_container .bottom_container_inner .right_content{
    width: 100%;
    padding-bottom: 45px;
    overflow: hidden;
}
#section .bottom_container .bottom_container_inner .right_content .top_list{
    width: 100%;
    overflow: hidden;
    position: relative;
}
#section .bottom_container .bottom_container_inner .right_content .top_list ul{
    display: block;
    width: max-content;
    position: relative;
}
#section .bottom_container .bottom_container_inner .right_content .top_list li{
    float: left;
    margin-left: 30px;
    color: #6c6c6c;
    cursor: pointer;
    font-size: 1em !important;
    line-height: 3;
}
#section .bottom_container .bottom_container_inner .right_content .top_list li:first-child{
    margin-left:0;
}
#section .bottom_container .bottom_container_inner .right_content .top_list li.active{
    color: #fff;
    background: #274395;
    padding: 0 12px;
    font-weight: bold;
    border-radius: 5px;
}
.line{
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: #274395;
    height: 3px;
    transition: left 0.3s, width 0.3s;
}
.line_inner{
    width: max-content;
    position: relative;
    padding: 9px 0;
    transition: margin-left 0.3s;
    margin: 0 auto;
}

/* right btn */
#section .bottom_container .bottom_container_inner .right_content .top_list span.next.active{
    opacity: 0;
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.next{
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 57px;
    background-color: rgba(255,255,255, .6);
    z-index: 9;
    cursor: pointer;
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.next span{
    position: relative;
    display: block;
    width: 100%;
    height: 14px;
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.next span::before,
#section .bottom_container .bottom_container_inner .right_content .top_list span.next span::after{
    content: "";
    right:0;
    display: block;
    position: absolute;
    width:20px;
    height: 1.5px;
    background-color: #274395;
    transform: rotate(45deg);
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.next span::after{
    bottom:-19px;
    transform: rotate(-45deg);
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.next span::before{
    top:19px;
}

/* left */
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev.active{
   
    opacity: 0;
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev{
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    height: 57px;
    background-color: rgba(255,255,255, .6);
    z-index: 9;
    cursor: pointer;
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev span{
    position: relative;
    display: block;
    width: 100%;
    height: 14px;
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev span::before,
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev span::after{
    content: "";
    left:0;
    display: block;
    position: absolute;
    width:20px;
    height: 1.5px;
    background-color: #274395;
    transform: rotate(-45deg);
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev span::after{
    bottom:-19px;
    transform: rotate(45deg);
}
#section .bottom_container .bottom_container_inner .right_content .top_list span.prev span::before{
    top:19px;
}

.chart_wrap{position: relative;}
.chart_wrap div.label{position: absolute; display: flex; width: 108px; justify-content: space-between;left: 50%; transform: translateX(-50%);}
.chart_wrap div.label p{font-size: 12px; color: #6c6c6c; font-weight: normal;cursor:default;}
.chart_wrap div.label p::before{
	content:'';
	width: 15px;
	height: 15px;
	margin-right: 4px;
	border-radius: 50%;
	display: inline-block;
	vertical-align: middle;
	border: 2px solid #eee;
}
.chart_wrap div.label p.grn::before{background: #A1DDC7;}
.chart_wrap div.label p.prl::before{background: #c7a8ff;}



/* pop_up */
.pop_up{
	position: fixed;
	top: 80px;
	left: 270px;
		
	width: 350px;
	height: 520px;
	background: #fff;
	overflow: hidden;
	box-shadow: 3px 3px 14px 4px rgba(66, 66, 66, 0.1);
	z-index: 10;
}
	
.pop_up .img_container{height: 500px; background: #ccc;}	
.pop_up .check{display: flex; align-items: center;}
.pop_up .btn_list{width:100%; height: 20px; padding: 0 10px; display: flex; align-items:center; justify-content: space-between;}
.pop_up .btn.close{height: fit-content; box-shadow: none !important; color: #2f2f2f; font-size: 12px; opacity: 1;}
.pop_up label{margin-left: 5px;margin-bottom: 0; color: #999;font-size: 12px; font-weight: 500;}






span.red{
	color:red;
}

.chart_wrap .right_content{
	    box-shadow: 0 0 18px 0 rgb(0 0 0 / 8%);
}






/* media */
/*-------- mobile --------*/
@media only screen and (max-width: 1024px){
	.pop_up{
		left: calc(100vw * (30/428));
	}
	.pop_up label{font-size: calc(100vw * (12/428));}
	.pop_up .btn.close{font-size: calc(100vw * (12/428));}
	.right_content .chart{
		overflow: scroll hidden;
	}
	.right_content .chart::-webkit-scrollbar{display:none;}
	
	.right_content .chart canvas{width: calc(100vw * (886/428)) !important;}
	.title h3{
		font-size: calc(100vw * (15/428));
	}
	.content li a{font-size: calc(100vw * (13/428)) !important;}
	
	/*문의하기버튼*/
	#section .btn_right .btn_right_cover > .btn_width{
		
		padding: calc(100vw * (10/428)) calc(100vw * (20/428));
		font-size: calc(100vw * (13/428));
		border: calc(100vw * (4/428)) solid #FFEEBF;
		border-radius: calc(100vw * (29/428)) ;
		top: calc(100vw * (83/428));
		right: calc(100vw * (20/428));
		width: calc(100vw * (131/428));
	}
	
	#section .btn_right .btn_right_cover.active > .btn_width{
		width: calc(100vw * (340/428));
		border-radius: calc(100vw * (29/428)) calc(100vw * (29/428)) 0 0;
	}
	#section .search_text_in{
		width: calc(100vw * (335/428));
		padding: calc(100vw * (20/428));
		right: calc(100vw * (22/428));
		top: calc(100vw * (128/428));
		border-radius: 0 0 calc(100vw * (29/428)) calc(100vw * (29/428));
		box-shadow: 0 calc(100vw * (10/428)) calc(100vw * (15/428)) 1px rgb(0 0 0 / 10%);
	}
	#section .search_text_in input[type="text"]{
		border: calc(100vw * (2/428)) solid #EFEFEF;
		border-radius: calc(100vw * (10/428));
		padding: calc(100vw * (10/428)) calc(100vw * (20/428));
		font-size:calc(100vw * (13/428));
	}
	#section .search_this .search_title{
		padding: calc(100vw * (10/428)) calc(100vw * (5/428));
	}
	#section .search_this .search_content{
	    padding-top: calc(100vw * (10/428));
   		max-height: calc(100vw * (200/428));
	}
	.btnA{padding: calc(100vw * (30/428)) 0;}
	.btnA a{
		padding: calc(100vw * (10/428)) calc(100vw * (22/428));
	    border-radius: calc(100vw * (3/428));
	    font-size: calc(100vw * (11/428));
	}
	
	#section .main_top{
		padding-top: calc(100vw * (74/428));
	}
	
	#section .top_container .top_container_inner{
		padding: 0 calc(100vw * (20/428));
	}
	.title{
		border-radius: calc(100vw * (8/428));
		padding: calc(100vw * (15/428)) calc(100vw * (20/428));
	}
	.content{padding: 0 calc(100vw * (10/428));}
	.content li span{
		font-size: calc(100vw * (12/428)) !important;
	}
	#section .center_container .center_container_inner,
	#section .bottom_container .bottom_container_inner{
		padding: calc(100vw * (20/428));
	}
	#section .center_container .center_container_inner dt{
		font-size: calc(100vw * (13/428)) !important;
	}
	#section .center_container .center_container_inner .left_top li dl dd{
		font-size: calc(100vw * (14/428)) !important;
		line-height: calc(100vw * (45/428));
	}
	#section .center_container .center_container_inner dd.right a{
	    width: calc(100vw * (45/428));
	    height: calc(100vw * (45/428));
	    padding: calc(100vw * (16/428));
	}
	
	#section .top_container .top_container_inner .left_content, #section .top_container .top_container_inner .right_content{
		height: calc(100vw * (500/428));
		min-height: calc(100vw * (450/428));	
	}
	
	.left_content, .left_content1{ border-radius: calc(100vw * (8/428)); padding: calc(100vw * (12/428));}
	#section .center_container .center_container_inner .left_top li{
		height: calc(100vw * (115/428));
		padding: calc(100vw * (22/428)) calc(100vw * (25/428));
		border-radius: calc(100vw * (8/428));	
	}
	.pop_up{
		top:calc(100vw * (80/428));
		left: 50%;
		width: calc(100vw * (350/428));
		height: calc(100vw * (520/428));
		box-shadow: calc(100vw * (3/428)) calc(100vw * (3/428)) calc(100vw * (14/428)) calc(100vw * (4/428)) rgba(66 66 66 /10%);
		transform: translateX(-50%);
	}
	
	.pop_up .img_container{height: calc(100vw * (500/428));}
	.pop_up .btn_list{height:calc(100vw * (20/428)); padding: 0 calc(100vw * (10/428));}
	.pop_up label{margin-left: calc(100vw * (5/428)); font-size: calc(100vw * (12/428));}
	.pop_up .btn.close{font-size: calc(100vw * (12/428));}
}