@font-face {
font-family: NanumSquareL;
src: url(/font/NanumSquareL.ttf);
}

*{box-sizing: border-box}



body{background: #001c65;font-family: 'NanumSquareL';}
#Fsun{font-family: 'Sunflower', sans-serif;}

header{position: fixed;left: 0;top: 0;width: 100%;height: 71px;background: #fff;z-index: 1000}
header #logo{margin-left: 212px;position: absolute;top: 0;width: 220px;height: 90px;
background: url(../03_04/img/logo_1.png)no-repeat left top;padding-top: 25px;text-align: center;cursor:pointer;}
header .nav{color: rgba(0,0,0,0.5);font-size: 1.2em;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%)}
header .nav ul{display: flex}
header .nav li{margin: 0 20px}
header .nav li a{transition: all .8s ease}
header .nav li a:hover{color: #000}
header .nav li a.on{color: #000}
header.bg0{background:#fff}
header.bg1{background:#ff3c00}
header.bg2{background:#00bec0}
header.bg3{background:#ff3c00}
header.bg4{background:#00bec0}
header.bg5{background:#ff3c00}

#logo.bg1{background: url(../03_04/img/logo_1.png)no-repeat left top;}
#logo.bg2{background: url(../03_04/img/logo_2.png)no-repeat left top;}
#logo.bg3{background: url(../03_04/img/logo_1.png)no-repeat left top;}
#logo.bg4{background: url(../03_04/img/logo_2.png)no-repeat left top;}
#logo.bg5{background: url(../03_04/img/logo_1.png)no-repeat left top;}

section{position: relative;}
.main_font{font-size: 5em;font-weight: bold;color: #fff;}

#home{width: 100%;height: 100vh;background: url(../03_04/img/main_bg_1.jpg)no-repeat left top ;
background-size: cover;line-height: 1.2}
#home::before{content: '';position: absolute;left: 208px;top: 70px;width: 340px;height: 650px;background: rgba(0,0,0,0.2);z-index: 10;}
#home p{position: absolute;left: 300px;top: 25%;z-index: 20;}
#home span{position: absolute;transform: translate(-50%,-50%);left: 50%;top: 50%;color:#fff;
font-size: 1.3em;}
#home i{font-style: normal;font-size: 1.5em;padding-bottom: 10px;display: block}

.inwrap{width: 1480px;margin: auto}

.Mmenu{position: sticky;top: 71px;width: 340px;height: 340px;padding-top: 5%;padding-bottom: 1%}
.Mmenu p{padding-left: 16px}
.Mmenu span{width: 100%;height: 2px;background: #fff;margin: 20px 0;display: block}
.Mmenu_left{float: left;}
.Mmenu_right{float: right;}

.content{clear: both;max-width: 1140px;min-height: 700px;background: #fff;overflow: hidden;}
.content_left{margin-left: 340px}
.content_right{margin-right: 340px}

#insper .Mmenu{background: #ff3c00}
#insper .content{padding-top: 30px}
#insper h2{font-weight: 700;font-size: 46px;line-height: 46px;color: #000000;}
#insper .content span{width: 2px;height: 30px;margin: 16px 0;background: #d9d9d9;display: block}
#insper .list{width: 49%;height: 600px;margin-left: 1%;position: relative;}
#insper .list:last-child{background: url(../03_04/img/content_1_bg.png)no-repeat left bottom}
#insper .tit{font-size: 36px;line-height: 46px;color: #000000;font-weight: bold}
#insper .content p{width: 80%;margin: 14px 0 0;font-size: 15px;line-height: 30px;color: #000000;}

#paperground{background: url(../03_04/img/main_bg_2.jpg)no-repeat center center;background-size: 100%;}
#paperground .Mmenu{background: #00bec0}
#paperground .content div{float: left;cursor: pointer;position: relative;}
#paperground .content >div::after{content: '';position: absolute;transform: translate(-50%,-50%);
left: 50%;top: 50%;background: #fff;transition: all .2s ease;opacity: 0}
#paperground .content div .hovBox{position: absolute;transform: translate(-50%,-50%);
left: 50%;top: 50%;transition: all .2s ease;z-index: 100;opacity: 0}
#paperground .content div> img{width: 100%;}
#paperground .content> div:nth-child(1){width: 760px;height: 380px}
#paperground .content> div:nth-child(1)::after{width: 688px;height: 304px}
#paperground .content> div:nth-child(2){width: 380px;height: 760px;float: right;}
#paperground .content> div:nth-child(2)::after{width: 304px;height: 688px}
#paperground .content> div:nth-child(3){width: 380px;height: 380px}
#paperground .content> div:nth-child(3)::after{width: 304px;height: 304px}
#paperground .content> div:nth-child(4){width: 380px;height: 380px}
#paperground .content> div:nth-child(4)::after{width: 304px;height: 304px}
#paperground .content> div:nth-child(5){width: 760px;height: 760px}
#paperground .content> div:nth-child(5)::after{width: 688px;height: 688px}
#paperground .content> div:nth-child(6){width: 380px;height: 760px;float: right;}
#paperground .content> div:nth-child(6)::after{width: 304px;height: 688px}
#paperground .icon{display: inline-block;width: 50px;height: 50px;border-radius: 50px;overflow: hidden;}
#paperground .icon img{width: 100%;}
#paperground .content div .hovBox p{padding: 8px 0;font-size: 16px}
#paperground .hovBox li{display: inline-block;vertical-align: bottom}
#paperground .content div:hover::after,#paperground .content div:hover .hovBox{opacity:1} 
#paperground .more{width: 348px;height: 100px;margin-left: 340px;background: #ff3c00;display: flex;justify-content: center;align-items: center;font-size: 24px;color:#fff;cursor: pointer;}

#products{background: url(../03_04/img/main_bg_3.jpg)no-repeat center center;background-size: 100%;}
#products .Mmenu{background: #ff3c00}
#products .slideContainer{position: relative;display: block;width: 500px;height: 400px;margin-top: 50px;margin-left: 5%;float: left;}
#products .slideWrap{width: 500px;height: 100%;position: relative;margin: auto;overflow: hidden;}
#products .slide{position: absolute;width: 100%;display: none}
.slide img{width: 100%;}
#products .slide.on{display: block}
#products .pointer{position: absolute;top: -30px;left: -5%;width: 220px;height: 90px;
background: url(../03_04/img/logo_1.png)no-repeat left top;color: #fff;font-size: 32px;
text-align: center;line-height: 2.8;font-weight: bold}
#products .listBox{position: absolute;right: -20px;bottom: 0;width: 400px;height: 150px;background: #eceef5;transition: all .3s ease;padding: 5% 0 0 5%}
#products .listBox li{position: absolute;opacity: 0;}
#products .listBox li.on{opacity: 1;}
#products .listBox h2{padding: 16px 0}
#products .listBox p{width: 350px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
#products .slideContainer:hover .listBox{background: #ffc21d;box-shadow: -16px 16px 5px rgba(0,0,0,0.3)}

#awards{background: url(../03_04/img/main_bg_4.jpg)no-repeat center center;background-size: 100%;}
#awards .Mmenu{background: #00bec0}
#awards .content{padding: 20px}
#awards h2{padding-bottom: 24px}
#awards h3{width: 90%;border-bottom: 1px solid #000;padding-bottom: 8px;margin-bottom: 16px}
#awards p{width: 85%;padding-left: 5%;line-height: 1.5}
#awards .w50{width: 50%;}
.pt30{padding-top: 30px}
#awards .rec{font-size: 13px;color: #ff4911;}
#awards .clear{clear: both}
#awards ul{display: flex}
#awards li{flex: 1;margin: 0 0 20px 20px;padding: 98px 20px;background: #f6f6f6;position: relative;}
#awards li .title{position: absolute;right: 0;top: 0}
#awards span.line{display: block;width: 90%;height: 1px;background: #666;margin: 10px 0}
#awards h4{padding: 10px 0}

#contactUs{background: url(../03_04/img/main_bg_5.jpg)no-repeat center center;background-size: 100%;}
#contactUs .Mmenu{background: #ff3c00}
#contactUs .content{padding: 20px 40px}
#contactUs .line{border-bottom: 1px solid #000;padding-bottom: 16px;margin-bottom: 36px}
#contactUs .NMB{margin-bottom: 0}
#contactUs .list{height: 200px;overflow: auto;margin: 20px 0;border: 1px solid #000;padding: 20px;line-height: 1.5}
#contactUs form{text-align: center}
#contactUs .rec{color: #ff4911}
#contactUs li{padding: 20px 0;border-bottom: 1px solid #ccc;width: 100%;display: flex}
#contactUs .tit{float: left;width: 120px;padding: 20px;font-weight: bold}
#contactUs .text{border: none;background: #f5f6fa;padding: 20px;width: 150px;position: relative;}
#contactUs .w300{width: 300px;}
#contactUs .Mr20{margin-right: 20px}
#contactUs .flex{flex: 1}
#contactUs .H200{height: 200px}
#contactUs .check{display: inline-block;padding: 20px 20px 20px 30px;position: relative;cursor: pointer;margin-left: 10px}
#contactUs .check::before{content: '';position: absolute; left: 0;top: 50%;transform: translateY(-50%);width: 20px;height: 20px;background: url(../03_04/img/rdo.png)no-repeat left top;cursor: pointer;}
#contactUs .check.on::before{content: '';background: url(../03_04/img/rdo.png)no-repeat left bottom}
#contactUs .pone{display: inline-block;margin: 20px 10px}
#contactUs .schBtn{border: 0;background: #87868d;color: #ffffff;padding: 20px;margin-left: 20px;cursor: pointer;}

footer{padding: 100px 0;text-align: center;line-height: 1.5;color: #fff}
footer li{display: inline-block}