@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

@font-face {
    font-family: 'Hahmlet-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2110@1.0/Hahmlet-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'RIDIBatang';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.0/RIDIBatang.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Danjo-bold-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-1@1.1/Danjo-bold-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* 초기화 */
:root{
	--c-mc :#3366cc;
	--c-maincolor :#3366cc;
	--c-mc-h :#ff6869;
	--c-maincolor-hover :#ff6869;
	--c-deepgreen : #006600;
	--c-white:#FFFFFF;
	--c-red:#A30000;
	--c-green:#9BAC3A;
	--c-black:#333333;
	--c-gray:#6c6c6c;
	--c-light-gray:#ccc;
	--c-dark-gray:#6c6c6c;

	--fz(min(max(calc((2vw + 10px) * 1.3)), 40px))

}

@media screen and (max-width: 576px) {/*MOBILE*/
	:root{
		--title1 : 22px;
		--mp200 :100px;
		--mp150 :80px;
		--mp120 :60px;
		--mp100 :50px;
		--mp90 : 50px;
		--mp80 : 40px;
		--mp70 : 35px;
		--mp60 : 35px;
		--mp50 : 30px;
		--mp40 : 25px;
		--mp30 : 20px;
		--mp20 : 15px;
		--mp10 : 10px;

		--fz60 : 40px;/*calc(60px * 0.65);*/
		--fz50 : 35px;
		--fz40 : 33px;
		--fz38 : 31px;
		--fz36 : 30px;
		--fz34 : 29px;
		--fz32 : 28px;
		--fz30 : 27px;
		--fz28 : 25px;
		--fz26 : 23px;
		--fz24 : 21px;
		--fz22 : 19px;
		--fz20 : 17px;
		--fz18 : 16px;
		--fz16 : 14px;
		--fz14 : 13px;
		--fz12 : 12px;
		--fz10 : 10px;
	}
}
@media screen and (min-width: 576px) and (max-width : 1200px){/*PC*/
	:root{
		--title1 : 38px;
		--mp200 :200px;
		--mp150 :150px;
		--mp120 :120px;
		--mp100 :100px;
		--mp90 : 90px;
		--mp80 : 80px;
		--mp70 : 70px;
		--mp60 : 60px;
		--mp50 : 50px;
		--mp40 : 40px;
		--mp30 : 30px;
		--mp20 : 20px;
		--mp10 : 10px;

		--fz60 : 44px;
		--fz50 : 38px;
		--fz40 : 34px;
		--fz38 : 33px;
		--fz36 : 32px;
		--fz34 : 31px;
		--fz32 : 30px;
		--fz30 : 28px;
		--fz28 : 26px;
		--fz26 : 24px;
		--fz24 : 22px;
		--fz22 : 20px;
		--fz20 : 18px;
		--fz18 : 17px;
		--fz16 : 15px;
		--fz14 : 14px;
		--fz12 : 12px;
		--fz10 : 10px;
	}
}
@media screen and (min-width: 1200px){/*PC*/
	:root{
		--my-background : #efefef;
		--title1 : 38px;
		--mp200 :200px;
		--mp150 :150px;
		--mp120 :120px;
		--mp100 :100px;
		--mp90 : 90px;
		--mp80 : 80px;
		--mp70 : 70px;
		--mp60 : 60px;
		--mp50 : 50px;
		--mp40 : 40px;
		--mp30 : 30px;
		--mp20 : 20px;
		--mp10 : 10px;

		--fz60 : 60px;
		--fz50 : 50px;
		--fz40 : 40px;
		--fz38 : 38px;
		--fz36 : 36px;
		--fz34 : 34px;
		--fz32 : 32px;
		--fz30 : min(max(calc(0.5vw + 20px)), 40px);
		--fz28 : 28px;
		--fz26 : 26px;
		--fz24 : 24px;
		--fz22 : 22px;
		--fz20 : 20px;
		--fz18 : 18px;
		--fz16 : 16px;
		--fz14 : 14px;
		--fz12 : 12px;
		--fz10 : 10px;
	}
}
::selection {background:#CCC;color:#FFF;}
div {cursor:default;}

.txtunderbar > a { display:block; color:#222; padding:0 5px; font-size:var(--fz16); text-align:center;text-decoration:none; line-height:1.8; position:relative; font-weight:bold; transition:0.5s cubic-bezier(.165,.84,.44,1);  transition:font-weight ease 0.2s; font-weight:500 }
.txtunderbar > a.on,
.txtunderbar > a:hover { color:var(--c-maincolor); transition:all ease 0.3s; font-weight:bold; }
.txtunderbar > a:before { position:absolute; width:100%; height:2px; left:0; bottom:0; background:transparent; content:''; transition:background ease 0.2s; }
.txtunderbar > a.on:before,
.txtunderbar > a:hover:before { background:var(--c-maincolor); }/*언더바*/


/* 2021-11-11 */
@media (max-width: 990px) {
	#navigation_type1{display: none;}
	#pcnaviblank {display:none;}

}
@media (min-width: 990px){
	#navigation_type1{display: block;}
	#mobile_navigation {display:none;}
	#pcnaviblank {display:static;}

}


@media (max-width: 720px) {
	/*It's Mobile Ver.*/
	#side_menu {display:none;}
	/*메인슬라이더*/
	.mainslider_txt1 {font-size:80px;line-height:140%;text-align:center;font-weight:800;}
	.mainslider_txt2 {font-size:60px;font-weight:600;text-align:center;}
	.mainslider_txt3 {font-size:24px;color:#FFF;font-weight:100;padding-top:10px;text-align:center;}

	#slider1_container {display:none;}
	#slider1_container_4mobile {display:static;}
	#slider1_container_sub {display:none;}
	#slider1_container_sub_4mobile {display:static;}

	/*메인사용*/
	.prdtit {font-size:30px;color:#FFF;font-weight:500;}
	.prdtit2 {font-size:22px;color:#FFF;}
	.prdtxt {font-size:12px;line-height:160%;color:#FFF;font-weight:100;}
	.main_owl_arrow_btn {width: 100%;position: absolute;z-index: 9999999999;	display: flex;justify-content:space-between;margin-top:20%;}
	.main_mt {margin-top:60px;;}
	.main_b2bbtn {display: inline-block;width:100%;margin:20px auto 0 auto;padding:10px 20px;border:1px solid #DD2F21;color: #DD2F21;text-align:center;}
	/*메인사용*/
	/**/
	.subvisual_margin {margin-top:70px;}

	.visual_text {font-size: 24px;color: #FFF;font-weight: 800;}
	.titletxt {color:#333333;font-size:20px;font-weight:600;}
	.subtitle {color:#333333;font-size:20px;font-weight:600;}
	.subtxt1 {font-size:14px;}
	.subtxtind {text-indent:-12px;padding-left:24px;}
	.subtxtind2 {text-indent:-16px;padding-left:28px;}

	.esgtitletxt {color:#333333;font-size:30px;font-weight:900;}

	.pol_ar {display:flex;align-items: center;padding:var(--mp20) 0;border-bottom:1px solid #969696;}
	.pol_num {padding:0 15px 0 10px;color:var(--c-mc);font-weight:800;font-size:var(--fz18);white-space:nowrap;}
	.pol_subj {padding:0 10px 0 0;word-break:keep-all;font-weight:var(--fz18);}
	.pol_txt {padding:0 10px 0 0;word-break:keep-all;color:#6d6d6d;}

	.box_num {padding:0 15px 0 10px;color:var(--c-mc);font-weight:800;font-size:var(--fz24);white-space:nowrap;}
	.box_txt {padding:0 10px 0 0;margin-top:var(--mp20);font-size:var(--fz20);word-break:keep-all;color:#6d6d6d;}

	.mobile_hide{display:none;};
	.mbr { display:none !important;}

}
@media (min-width: 720px)/* and (max-width: 990px) {
}
@media (min-width: 990px) */
{
	/*It's PC Ver*/
	#side_menu {display:static;}
	
	/*메인슬라이더*/
	.mainslider_txt1 {font-size:60px;line-height:140%;font-weight:800;}
	.mainslider_txt2 {font-size:40px;font-weight:400;}
	.mainslider_txt3 {font-size:18px;color:#FFF;font-weight:100;padding-top:10px;}

	#slider1_container {display:static;}
	#slider1_container_4mobile {display:none;}
	#slider1_container_sub {display:static;}
	#slider1_container_sub_4mobile {display:none;}


	.leftsub {width:100%;padding:11px 0 11px 10px;border-bottom:1px solid #dbdbdb;color:#111111;font-size:14px;cursor:pointer;;}
	.leftsub_on {width:100%;padding:11px 0 11px 10px;border-bottom:1px solid #46BCB0;font-size:14px;;background:#46BCB0;color:#FFF;}
	.leftsub_on a{color:#FFF;}

	/*메인사용*/
	.prdtit {font-size:30px;color:#FFF;font-weight:500;}
	.prdtit2 {font-size:22px;color:#FFF;}
	.prdtxt {font-size:15px;line-height:160%;color:#FFF;font-weight:100;}
	.main_owl_arrow_btn {width: 100%;position: absolute;z-index: 9999999999;	display: flex;justify-content:space-around;margin-top:10%;}
	.main_mt {margin-top:120px;;}
	.main_b2bbtn {display: inline-block;margin-top:20px;padding:10px 20px;border:1px solid #DD2F21;color: #DD2F21;}
	/*메인사용*/
	/**/
	.subvisual_margin {margin-top:90px;}
	.visual_text {font-size: 38px;color: #FFF;font-weight: 800;}
	.titletxt {color:#333333;font-size:var(--fz26);font-weight:500;}
	.subtitle {color:#333333;font-size:22px;font-weight:700;}
	.subtxt1 {font-size:var(--fz18);line-height:160%;}
	.subtxtind {text-indent:-12px;padding-left:12px;}
	.subtxtind2 {text-indent:-12px;padding-left:12px;}

	.esgtitletxt {color:#333333;font-size:50px;font-weight:900;}
	.esgtitle2txt {color:#333333;font-size:30px;font-weight:900;}

	.pol_ar {padding:var(--mp20) 0;border-bottom:1px solid #969696;}
	.pol_num {padding:0 5px 0 0;color:var(--c-mc);font-weight:800;font-size:var(--fz18);white-space:nowrap;}
	.pol_subj {padding:0 10px 0 0;color:#333333;font-size:var(--fz18);font-weight:700;word-break:keep-all;letter-spacing:-1px;}
	.pol_txt {padding:0 10px 0 0;word-break:keep-all;color:#6d6d6d;}

	.box_num {padding:0 5px 0 0;color:var(--c-mc);font-weight:800;font-size:var(--fz40);white-space:nowrap;}
	.box_txt {padding:0 10px 0 0;margin-top:var(--mp20);font-size:var(--fz22);word-break:keep-all;color:#6d6d6d;}


	.mobile_hide{display:block;};
	.mbr {display: inline-block;content: " ";padding: 0 2px;}

}
	.redsubjdot {width:9px;height:9px;margin-left:8px;border-radius:8px;background:var(--c-mc);}
	.reddot {width:9px;height:9px;border-radius:8px;background:var(--c-mc);}
	.bluedot {width:9px;height:9px;margin-left:5px;border-radius:8px;background:#006de3;}

.ttm {margin-top:var(--mp120);}

.imgfw {width:100%;}
.img90 {width:100%;padding:0 5%;}
.img80 {width:100%;padding:0 10%;}

.subtiten {font-size:32px;color:#000;font-weight:600;}
.subtitkr {font-size:20px;color:#000;font-weight:400;}

#history {width:100%;border-collapse:collapse;}
#history td{font-size:16px;;padding:20px 0;border-top:1px solid #cccccc}
#history div{padding:10px;}
.hisac {font-size:12px;}

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.lifeature {list-style:none;list-style-position: inside;text-indent: -15px;  padding-left: 15px;word-break:keep-all;}


.ftco:after {content:" |";padding:0 10px;;}

.esgicon {width:100%;border: 2px solid #EBEBEB;transition:width 0.5s;}
.esgicon:hover {width:103%;transition:width 0.5s;border: 2px solid transparent; border-image: linear-gradient(to right, red 0%, blue 100%);	border-image-slice: 1;}

.rotated_gradient_box:hover {
  width:102%;
  filter: hue-rotate(360deg);
  border: 3px solid transparent;
  border-radius:3px;
  background-image: linear-gradient(#444, #444), linear-gradient(to left,#37a9fa,#5951f3);
  background-clip: content-box, border-box;
  background-origin: border-box;
  animation: huerotate 6s infinite linear;
}

@keyframes huerotate {
  0% {
	filter: hue-rotate(0deg);
  }
  100% {
	filter: hue-rotate(360deg);
  }
}


.bnbtn_box {display:flex;justify-content: flex-end;}
.bnbtn {padding:5px var(--mp20);margin-left:10px;font-size:var(--fz24);cursor:pointer;border:1px solid #ccc;border-radius:5px;}
.bnbtn_on {padding:5px var(--mp20);color:#FFF;background:var(--c-mc) linear-gradient(135deg, rgba(255,0,0,1) 0%, rgba(175,44,159,1) 51%, rgba(4,10,219,1) 100%)}
.frameimg {
  border:solid 2px;
  border-bottom-color:#ffe;
  border-left-color:#eed;
  border-right-color:#eed;
  border-top-color:#ccb;
  max-height:100%;
  max-width:100%;
}

.frame {
  background-color:#ddc;
  border:solid 4vmin #eee;
  border-bottom-color:#fff;
  border-left-color:#eee;
  border-radius:2px;
  border-right-color:#eee;
  border-top-color:#ddd;
  box-shadow:0 0 5px 0 rgba(0,0,0,.25) inset, 0 5px 10px 5px rgba(0,0,0,.25);
  box-sizing:border-box;
  display:inline-block;
  padding:1vmin;
  position:relative;
  text-align:center;
  &:before {
	border-radius:2px;
	bottom:-2vmin;
	box-shadow:0 2px 5px 0 rgba(0,0,0,.25) inset;
	content:"";
	left:-2vmin;
	position:absolute;
	right:-2vmin;
	top:-2vmin;
  }
  &:after {
	border-radius:2px;
	bottom:-2.5vmin;
	box-shadow: 0 2px 5px 0 rgba(0,0,0,.25);
	content:"";
	left:-2.5vmin;
	position:absolute;
	right:-2.5vmin;
	top:-2.5vmin;
  }
}
