/* html */

/* header */
#haeder{width: 100%;height: 200px;}
#haeder>.header{width: 1240px;height: 100%;margin: 0 auto;}
#haeder>.header>.laftLogo{width: 210px;height: 100%;float: left;line-height: 200px;}
#haeder>.header>.laftLogo>a{display: block;width: 100%;height: 100%;}
#haeder>.header>.mainLogo{width: 820px;height: 100%;float: left;line-height: 200px;}
#haeder>.header>.rigthLogo{width: 210px;height: 100%;float: left;line-height: 200px;}
#haeder>.header img{max-width: 100%;max-height: 100%;vertical-align: middle;}

/* menu */
#gnb{width: 100%;height: 90px; background: #293647;}
#gnb>ol{width: 1240px;height: 100%;margin: 0 auto;}
#gnb>ol>li{width: 16.666%;height: 100%;float: left; color: #fff; }
#gnb>ol>li>a{display: block;width: 100%;height: 100%;text-align: center;font-size: 20px;line-height: 80px;font-weight: bold;font-family: "DIGICO MEDIUM";}
#gnb>ol>li>a:hover{background: #fff;color: #293647;}

#gnb.on{margin-top: -200px; width: 100%;background: #fff;height: 80px;z-index: 100;box-shadow: 2px 2px 2px #293647;}
#gnb.on>ol>li{color: #293647;}
#gnb.on>ol>li>a.on{border-bottom: 4px solid #335c7c;}
#gnb.on>ol>li>a:hover{border-bottom: 4px solid #335c7c;}

.mo_bar{width: 100%;height: 80px;background: #fff;padding: 10px 0 0 20px;position: fixed;z-index: 20;border-bottom: 1px solid #293647;}
.mo_gnb{position: fixed;top: 30px;right: 10px; z-index: 30;}
.menu-trigger,
.menu-trigger span {display: inline-block;transition: all 0.4s;box-sizing: border-box;}
.menu-trigger {position: relative;width: 30px;height: 20px;}
.menu-trigger span{position: absolute;left: 0;width: 100%;height: 4px;background-color: #293647;border-radius: 4px;}
.menu-trigger span:nth-of-type(1) {top: 0;}
.menu-trigger span:nth-of-type(2) {top: 8px;}
.menu-trigger span:nth-of-type(3) {bottom: 0;}
/* 2th bar 사라지고,  1st 3rd bar 회전하며 X  */
.menu-trigger.active-1 span:nth-of-type(1) {transform: translateY(8px) rotate(-35deg);}
.menu-trigger.active-1 span:nth-of-type(2) {opacity: 0;}
.menu-trigger.active-1 span:nth-of-type(3) {transform: translateY(-8px) rotate(35deg);}
.menu-trigger span.st{background: #293647;}
.menu-trigger span.ss{background: #293647;}

.mo_gnb_menu{width: 100%;background: #999;padding: 50px 0 10px;background: #293647;position: fixed;z-index: 10;display: none;}
.mo_gnb_menu>ul>li>a{display: block;width: 100%;height: 100%;text-align: center;line-height: 40px;font-weight: bold;font-size: 18px;color: #fff;background: #293647;}
.mo_gnb_menu>ul>li>a.on{background: #fff;color: #293647;}
.mo_gnb_menu>ul>li>a:hover{background: #fff;color: #293647;}



/* visual */
#visual{width: 100%; height: 580px;position: relative;}
#visual>img{width: 100%;height: 100%;z-index: -1;position: absolute;}
#visual>.visual_wep{width: 1240px;height: 100%;margin: 0 auto; display: table;}
#visual>.visual_wep>.visualText{width: 100%;height: 100%; display: table-cell; vertical-align: middle;}
#visual>.visual_wep>.visualText>h4{font-size: 80px;font-family: "KTfontBold";}
#visual>.visual_wep>.visualText>p{font-size: 25px;font-family: "KTfontBold";}


/* contents */
/* contents_wep */
#contents>div{width: 100%;padding: 30px 0;}
/* class content */
#contents>div>div{width: 1240px;margin: 0 auto;text-align: center;}
/* contetn text */
#contents>div>div>.content_title{font-size: 45px;font-family: "KTfontBold";}
#contents>div>div>.content_subtitle{font-size: 20px;margin-bottom: 30px;font-family: "KoPubDotumBold";}
#contents>div>div>.content_text{font-size: 18px;margin-top: 30px;font-family: "KoPubDotumMedium";line-height: 38px;}

/* composition S*/
#introduction>.introduction>h2{font-family: "KoPubDotumBold";}


#composition>.composition>.composition_item{width: 100%;margin-top: 30px;}
#composition>.composition>.composition_item>.composition_tapmenu{width: 100%;height: 80px;border-radius: 40px;background: linear-gradient(to right, #8eb8d2, #4a646d);padding: 10px;margin-bottom: 30px;display: flex;justify-content: space-between;}
#composition>.composition>.composition_item>.composition_tapmenu>li{width: 20%;height: 100%;border-radius: 40px;color: #fff;font-family: "KoPubDotumBold";line-height: 60px;cursor: pointer;font-size: 20px;}
#composition>.composition>.composition_item>.composition_tapmenu>li:last-child{margin-right: 0;}
#composition>.composition>.composition_item>.composition_tapmenu>li.on{background: #fff;color: #000;}
#composition>.composition>.composition_item>.composition_tapmenu>li:hover{background: #fff;color: #000;}

#composition>.composition>.composition_item>.img_box>img{display: none;}
#composition>.composition>.composition_item>.img_box>img.on{display: block;}




/* #composition>.composition>.composition_item{padding-left: 45px;text-align: left;margin-top: 30px;}

#composition>.composition>.composition_item>.text_box{width: 100%;height: 90px;}
#composition>.composition>.composition_item>.text_box>.item_number{width: 70px;height: 100%; float: left;margin-right: 5px;}
#composition>.composition>.composition_item>.text_box>.item_text{width: calc(100% - 75px);height: 100%; float: left;}
#composition>.composition>.composition_item>.text_box>.item_text>h3{font-size: 25px;}
#composition>.composition>.composition_item>.text_box>.item_text>p{font-size: 18px; word-break: keep-all; line-height: 30px;}

#composition>.composition>.composition_item>.img_box{padding-left: 75px;margin-top: 30px;} */

/* composition E*/

#typeNprice>.typeNprice .item_title{font-size: 25px; font-family: "KoPubDotumBold";}
#typeNprice>.typeNprice .item_text{margin-top: 20px;}
#typeNprice>.typeNprice .item_text>p{margin-bottom: 10px;font-weight: normal; font-family: "KoPubDotumMedium";font-size: 12px;}
#typeNprice>.typeNprice .item_text>p:last-child{margin-bottom: 0;}
#typeNprice>.typeNprice table th{background: #5c7d96; color: #fff;font-size: 15px; font-family: "KoPubDotumBold";}
#typeNprice>.typeNprice table td{background: #dfe9f5;font-size: 14px; font-family: "KoPubDotumBold";}
#typeNprice>.typeNprice div{margin-bottom: 30px;}
/* tupeNprice item 1 S*/
#typeNprice>.typeNprice>.typeNprice_item1>table{width: 100%;font-weight: bold;}
#typeNprice>.typeNprice>.typeNprice_item1>table tr{height: 50px;}
#typeNprice>.typeNprice>.typeNprice_item1>table tr:first-child{height: 60px;}
/* tupeNprice item 1 E*/
/* tupeNprice item 2 S*/
#typeNprice>.typeNprice>.typeNprice_item2>table{width: 100%;}
#typeNprice>.typeNprice>.typeNprice_item2>table tr{height: 50px;}
#typeNprice>.typeNprice>.typeNprice_item2>table tr:first-child{height: 60px;}
/* tupeNprice item 2 E*/
/* tupeNprice item 3 S*/
#typeNprice>.typeNprice>.typeNprice_item3>table{width: 100%;font-weight: bold;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(1){height: 60px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(2){height: 70px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(3){height: 160px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(4){height: 55px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(5){height: 85px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(6){height: 85px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(7){height: 55px;}
#typeNprice>.typeNprice>.typeNprice_item3>table tr:nth-of-type(8){height: 115px;}
/* tupeNprice item 3 E*/
#typeNprice>.typeNprice>h5{font-size: 25px;}
#typeNprice>.typeNprice>h6{font-size: 18px;font-weight: normal;}

#stupport>.stupport>.stupport_item{width:100%;margin: 0 auto 30px;text-align: left;}
#stupport>.stupport>.stupport_item:last-child{margin-bottom: 0;}
#stupport>.stupport>.stupport_item>p{width: 100%;}
#stupport>.stupport>.stupport_item>.item_title{height: 60px;line-height: 60px;background: #335c7c; color: #fff;font-size: 20px;padding: 0 20px; cursor: pointer;font-weight: bold; font-family: "KoPubDotumBold";}
#stupport>.stupport>.stupport_item>.item_title>span{float: right;font-size: 24px;}
#stupport>.stupport>.stupport_item>.item_text{background: #bfd4eb;font-size: 18px;color: #000;padding: 20px 0 20px 20px;display: none;font-weight: bold;}
#stupport>.stupport>.stupport_item.on>.item_text{display: block; font-family: "KoPubDotumBold";}

/* download box*/
#stupport>.stupport>.download_box{display: flex;flex-wrap: wrap;}
#stupport>.stupport>.download_box>div{width: 50%;padding: 5px;}
#stupport>.stupport>.download_box>div>a{width: 100%;border: 1px solid black;line-height: 60px;display: flex;justify-content: space-between; align-items: center; padding: 0 30px;}
#stupport>.stupport>.download_box>div>a>h4{width: 80%;text-align: left;font-size: 18px; font-family: "KoPubDotumBold";}
#stupport>.stupport>.download_box>div>a>img{width: 30px; height: 30px;}

/* link box*/
#stupport>.stupport>.link_box{display: flex;flex-wrap: wrap;width: 100%}
#stupport>.stupport>.link_box>div{width: 50%;display: flex;justify-content: center;text-align: left; font-size: 18px; font-family: "KoPubDotumMedium";align-items: center;}
#stupport>.stupport>.link_box>div:first-child{padding: 0 50px 0 20px;}
#stupport>.stupport>.link_box>div:last-child{padding: 0 20px 0 50px;}
#stupport>.stupport>.link_box>div>img{width: 100px;}
#stupport>.stupport>.link_box>div>div{width: calc(100% - 100px);padding-left: 30px}
#stupport>.stupport>.link_box>div>div>p{margin-bottom: 5px;}


/* composition E */

/* footer */
#footer{height: 300px;background: #282828; color: #fff; display: flex; align-items: center;}
#footer>.footer{width: 1240px; margin: 0 auto;font-family: "KoPubDotumBold";}
#footer>.footer>p{margin-bottom: 10px;font-size: 18px;font-weight: bold;}
#footer>.footer>p:last-child{margin-bottom: 0;}

/* fixed menu */
.fixed_menu{position: fixed;right: 15px;bottom: 30px;color: #fff;display: flex; align-items: center;}
.fixed_menu>a{display: inline-block;width: 50px;height: 50px;line-height: 50px;font-size: 25px;margin-left: 10px;}