@charset "utf-8";

/*----- font -----*/
@font-face {
font-family: 'nanumsquarer';
src: url('/fonts/nanumsquarer.eot');
src: url('/fonts/nanumsquarer.eot?#iefix') format('embedded-opentype'),
url('/fonts/nanumsquarer.woff') format('woff'),
url('/fonts/nanumsquarer.ttf') format('truetype'),
url('/fonts/nanumsquarer.svg#nanumsquarer') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'nanumsquareb';
src: url('/fonts/nanumsquareb.eot');
src: url('/fonts/nanumsquareb.eot?#iefix') format('embedded-opentype'),
url('/fonts/nanumsquareb.woff') format('woff'),
url('/fonts/nanumsquareb.ttf') format('truetype'),
url('/fonts/nanumsquareb.svg#nanumsquareb') format('svg');
font-weight: bold;
font-style: normal;
}


/*---------- reset ----------*/
html{margin: 0; padding: 0; overflow-y: scroll; overflow-x: hidden;}
body{margin: 0; padding: 0; position: relative; margin: 0; font-family: 'nanumsquarer', sans-serif; font-size: 1em; line-height: 1.5; -webkit-text-size-adjust: none;}
html.open{overflow: hidden;}
html.bg-grey{background-color: #f4f4f4;}
header, h1, h2, h3, h4, h5, h6, section, p, ol, ul{margin: 0; padding: 0;}
button, select, input, textarea{font-family: 'nanumsquarer', sans-serif;}
button{-moz-appearance: none; -webkit-appearance: none; appearance: none;}
li{margin: 0; padding: 0; list-style: none;}
a{text-decoration: none;}
a[href^="tel"]{color: inherit;}
img{border: 0;}
em{font-style: normal;}
hr{display: none;}
caption{left: -9999px; width: 0.01em; height: 0.01em; font-size: 0.01em; line-height: 0.01em; visibility: hidden; overflow: hidden;}

/*---------- module ----------*/
/*accessibility */
.ir-wa{display: block; overflow: hidden; position: relative; width: 100%; height: 100%; z-index: -1;}
.blind{display: block; overflow: hidden; position: absolute; width: 0.1px; height: 0.1px; font-size: 0.1px; line-height: 1;}

/* heading */
.h-t01{margin-bottom: 5px; font-size: 22px; line-height: 22px; color: #3b3a40;}
.h-t02{margin-bottom: 20px; font-size: 20px; line-height: 22px; color: #fff; text-align: center;}

/* em */
.em-weigtier{color: #dd052b !important;}

/* icon */
.ico_{display: inline-block; vertical-align: middle; background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain;}
.ico_.story01{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story01.png);}
.ico_.story02{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story02.png);}
.ico_.story03{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story03.png);}
.ico_.story04{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story04.png);}
.ico_.story05{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story05.png);}
.ico_.story06{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story06.png);}
.ico_.story07{width: 40px; height: 42px; background-image: url(/resources/images/m/kr/sk/common/ico_story07.png);}

/* txt */
.txt-desc{margin-bottom: 22px;font-size: 13px; line-height: 15px; color: #94939c; padding: 0 20px;}

/* link */
.link-t01{text-decoration: underline; color: #aa6013;}
.link-more{font-size: 13px; line-height: 14px; color: #ec851a;}
.link-more:after{content: ""; display: inline-block; width: 25px; height: 8px; margin-top: -1px; margin-left: 8px; vertical-align: middle; background: url(/resources/images/m/kr/sk/common/ico_more.png) no-repeat 0 0; -webkit-background-size: auto 100%; background-size: auto 100%;}
.link-more02{font-size: 9px; line-height: 13px; color: #888;}
.link-more02:after{content: ""; display: inline-block; margin-left: 5px; width: 9px; height: 9px; vertical-align: middle; background: url(/resources/images/m/kr/sk/common/ico_more02.png) no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}

/* list */
.list-story{clear: both; border-top: 1px solid #f4f4f4; overflow: hidden;}
.list-story > li{float: left; display: block; width: 33.3%; height: 118px; border-right: 1px solid #f4f4f4; border-bottom: 1px solid #f4f4f4; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.list-story > li:nth-child(3), .list-story > li:nth-child(6){border-right: none;}
.list-story .link{display: block; height: 100%;}
.list-story .ico_{margin: 16px auto 10px;}
.list-story .txt{display: block; margin-bottom: 2px; font-size: 10px; line-height: 14px; color: #63616d;}
.list-story .tit{display: block; font-weight: bold; font-size: 14px; line-height: 16px; color: #ec851a;}

.list-subsidiary{border-top: 1px solid #626262; border-left: 1px solid #626262; border-right: 1px solid #626262;}
.list-subsidiary > li{position: relative;border-bottom: 1px solid #626262;}
.list-subsidiary .link{display: block; padding: 12px 12px 11px;}
.list-subsidiary .tit{display: block; font-weight: normal; font-size: 15px; line-height: 20px; color: #fff;}
.list-subsidiary .txt{display: block; font-size: 12px; line-height: 15px; color: #fff;}
.list-subsidiary .more{position: absolute; top: 12px; right: 12px; font-size: 13px; color: #ec851a;}
.list-subsidiary .more:after{content:""; display: inline-block;  width: 5px; height: 9px;  margin-left: 5px; vertical-align: middle; background: url(/resources/images/m/kr/sk/common/ico_more03.png) no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}

.list-board{}
.list-board li{}
.list-board .link{font-size: 11px; line-height: 20px; color: #444;}

/*---------- layout ----------*/

.wrap{max-width: 1024px; margin: 0 auto;}
.header{position: fixed; top: 0; left: 0; right: 0; background: #fff; z-index: 20; box-shadow: 0 0 5px #dadada;}
.header .inner{position: relative; height: 66px; padding: 12px 10px 0 0; text-align: right;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.header .logo a{position: absolute; top: 12px; left: 30px; width: 74px; height: 41px; padding: 0; background: url(/resources/images/m/kr/sk/common/logo.png) no-repeat 0 0; -webkit-background-size: auto 100%; background-size: auto 100%;}


.header .language{position: relative; display: inline-block; vertical-align: top; margin-top: 5px; width: 78px; padding: 0; text-align: center; background: #fff url(/resources/images/m/kr/sk/common/header_down.png) 0 0 no-repeat; -webkit-background-size: contain; background-size: contain; border: 1px solid #d4d4d4; z-index: 30;
	-webkit-border-radius: 16px; 
	-moz-border-radius: 16px; 
	border-radius: 16px;
}
.header .language a{display: block; color: #de7b14; font-weight: bold; line-height: 32px; font-size: 12px;}
.header .language > ul { top: 27px; display: none;}
.header .language > ul li {line-height: 1.5;}
.header .language > ul li:last-child{margin-bottom: 5px;}
.header .language > ul li a {position: relative; line-height: 14px; display: inline-block; color: #666;
	-webkit-transition: color 0.2s ease; 
	-moz-transition: color 0.2s ease; 
	-o-transition: color 0.2s ease; 
	-ms-transition: color 0.2s ease; 
	transition: color 0.2s ease;
}
.header .language > ul li a:hover {color: #de7b14;}

.header .btnMenu{position: relative; display: inline-block; width: 40px; height: 40px; background: transparent; border: none; z-index: 10;}
.header .btnMenu .bar01{position: absolute; top: 11px; left: 10px; display: block; width: 20px; height: 3px; background-color: #ec851a; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -kthtml-transition: all 0.4s ease; transition: all 0.4s ease;}
.header .btnMenu .bar02{position: absolute; top: 19px; left: 10px; display: block; width: 20px; height: 3px; background-color: #ec851a; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -kthtml-transition: all 0.4s ease; transition: all 0.4s ease;}
.header .btnMenu .bar03{position: absolute; top: 27px; left: 10px; display: block; width: 20px; height: 3px; background-color: #ec851a; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -kthtml-transition: all 0.4s ease; transition: all 0.4s ease;}

.header.open .btnMenu{position: relative; display: inline-block; width: 40px; height: 40px; background: transparent; border: none; z-index: 10;}
.header.open .btnMenu .bar01{width: 27px; height: 2px; top: 8px; left: 5px;-webkit-transform: rotate(45deg) translate(8px, 7px); -ms-transform: rotate(45deg) translate(8px, 7px); transform: rotate(45deg) translate(8px, 7px);}
.header.open .btnMenu .bar02{display: none;}
.header.open .btnMenu .bar03{width: 27px; height: 2px; top: 24px; left: 5px; -webkit-transform: rotate(-45deg) translate(4px, -4px); -ms-transform: rotate(-45deg) translate(4px, -4px); transform: rotate(-45deg) translate(4px, -4px);}


.wrap_lnb{position: absolute; top: 66px; right: -240px; width: 240px; overflow-y: auto;  z-index: 10; background: #fff;  z-index: 20;
	-webkit-transition:all .2s ease-in-out;
    -moz-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out;
    -webkit-overflow-scrolling: touch;
}
.header.open .wrap_lnb{right: 0;}
.lnb .depth01{position: relative;}
.lnb .depth01 > a{display: block; height: 40px; font-size: 18px; line-height: 42px; color: #333; font-weight: bold; border-left: 3px solid #ec851a; border-top: 1px solid #e2e2e2; padding-left: 15px; letter-spacing: -1px;}

.lnb .depth02 > li a{position: relative; display: block; height: 30px; font-size: 12px; line-height: 30px; color: #555; padding-left: 20px; border-top: 1px solid #e2e2e2; background-color: #f4f4f4;}
.lnb .depth02 > li a:hover, .lnb .depth02 > a:focus, .lnb .depth02 a.on{text-decoration: underline; color: #ec851a;}

.lnb .depth03 > a:after{content: ""; position: absolute; top: 9px; right: 15px; display: inline-block; width: 10px; height: 10px; vertical-align: middle; background: url(/resources/images/m/kr/sk/common/ico_plus.png) no-repeat 0 0; -webkit-background-size: auto 100%; background-size: auto 100%;}
.lnb .depth03 > ul{display: none;}
.lnb .depth03 > ul li a{position: relative; display: block; height: 30px; font-size: 12px; line-height: 32px; color: #fff; padding-left: 30px; border-top: 1px solid #e2e2e2; background: #828d96;}
.lnb .depth03 > ul li a:hover, .lnb .depth03 > ul li a:focus{text-decoration: underline; color: #fff;}
.lnb .depth03 > ul li a:before{content:""; position: absolute;  top: 15px; left: 22px; display: inline-block; width: 4px; height: 1px; background-color: #fff;}

.lnb .depth03.open > a{text-decoration: underline; color: #ec851a;}
.lnb .depth03.open > a:after{content: ""; position: absolute; top: 9px; right: 15px; display: inline-block; width: 10px; height: 10px; vertical-align: middle; background: url(/resources/images/m/kr/sk/common/ico_minus.png) no-repeat 0 0; -webkit-background-size: auto 100%; background-size: auto 100%;}
.lnb .depth03.open > ul{display: block;}
.lnb .depth03.open > ul li a{}


.footer{position: relative; padding: 17px 30px 24px; background-color: #434343;   text-align: center;}
.footer .areaTerm .link{position: relative; display: inline-block; padding-right: 6px; font-size: 12px; color: #fff;}
.footer .areaTerm .link + .link{padding-left: 6px;}
.footer .areaTerm .link + .link:after{content:""; position: absolute; top: 3px; left: -2px; display: block; width: 1px; height: 7px; background-color: #757575;}
.footer .areaFamilysite{position: absolute; top: 15px; right: 30px;}
.footer .areaFamilysite .btnSiteOpen{position: relative; width: 90px; padding: 0; font-size: 10px; line-height: 17px; text-align: left; color: #c3c4c7; border: 0; border-bottom: 1px solid #6a6b6f; background: transparent;}
.footer .areaFamilysite .btnSiteOpen:after{content: ""; position: absolute; top: 6px; right: 0; display: block; width: 5px; height: 3px; background: url(/resources/images/m/kr/sk/common/arrow_family.png) no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}
.footer .txtFoo{margin-top: 16px; font-size: 10px; letter-spacing: -0.04em; line-height: 15px; color: #a5a6aa;}
.footer .txtFoo .dash{display: inline-block; width: 1px; height: 7px; margin: 0 7px; background-color: #757575;}
.footer .copy{font-size: 9px; line-height: 15px; color: #a5a6aa;}

.bg_dim{position: absolute; top: 66px; left: 0; display: none; width: 100%; height: 100%; background-color: rgba(0,0,0,0.25); z-index: 10;}

/*---------- contents ----------*/
/* main */
.visual{position: relative; display: block; overflow: hidden; padding-top: 66px;}
.visual .txtVisu{position: absolute; top: 40px; left: 30px; width: 200px; z-index: 10;}
.visual .txtVisu:after{content:""; display: block; padding-bottom: 50%; background: url(/resources/images/m/kr/sk/main/visu_txt.png) no-repeat 0 0; -webkit-background-size: 100% auto; background-size: 100% auto;}
.visual .slick-slider{position: relative; display: block;}
.visual .slick-list{display: block; overflow: hidden; z-index: 1;}
.visual .slick-track{display: block;}
.visual .slick-slide{display: block; float: left; position: relative;}
.visual .slider{padding-bottom: 10%; background-position: center center; -webkit-background-size: cover; background-size: cover;}
.visual .slider a{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.visual .slider .desc{position: absolute; top: 10%; left: 8%; color: #fff;}
.visual .slider .desc strong{font-size: 28px; text-shadow: 1px 1px 2px #484848; letter-spacing: -1px;}
.visual .slider .desc p{font-size: 15px; text-shadow: 1px 1px 2px #484848;}
.visual .slick-prev, .visual .slick-next{display: none !important;}
.visual .slick-dots{position: absolute; bottom: 6%; left: 0; width: 100%;text-align: center;}
.visual .slick-dots li {display: inline-block; margin: 0 5px; width: 10px; height: 10px; vertical-align: middle; background-color: #fff; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
.visual .slick-dots li.slick-active{background-color: #ec851a;}

.sect-story{padding-top: 39px; text-align: center;}
.sect-subsidiary{padding: 25px 20px; background: url(/resources/images/m/kr/sk/main/bg_gas.jpg) no-repeat center center; -webkit-background-size: cover; background-size: cover;}

.sect-pr{padding-top: 39px; text-align: center;}
.sect-pr .areaPr .img{line-height: 0; /*border-top: 1px solid #e4e7ea;*/}
.sect-pr .areaPr .img img{width: 100%; height: auto;}
.sect-pr .areaPr .cont{display: table; width: 100%; margin: 20px 0 38px;}
.sect-pr .areaPr .data{display: table-cell; width: 60%; padding-left: 30px; text-align: left; vertical-align: middle;}
.sect-pr .areaPr .data02{display: table-cell; width: 100%; padding: 0 30px; text-align: left; vertical-align: middle;}
.sect-pr .areaPr .tit{display: block; margin-bottom: 9px; font-weight: bold; font-size: 18px; line-height: 18px; color: #3b3a40;}
.sect-pr .areaPr .txt01{display: block; margin-bottom: 1px; font-size: 12px; line-height: 15px; color: #444;}
.sect-pr .areaPr .txt02{display: block; font-size: 12px; line-height: 15px; color: #888;}
.sect-pr .areaPr .wrapLink{display: table-cell; width: 40%; padding-right: 30px; text-align: right; vertical-align: middle; border-left: 1px solid #ededed;}

.sect-board{padding: 0 30px 40px; border-top: 1px solid #efefef;}
.sect-board .areaBoard{position: relative; padding-top: 23px;}
.sect-board .areaBoard + .areaBoard{margin-top: 15px; border-top: 1px solid #ededed;}
.sect-board .link-more02{position: absolute; top: 26px; right: 0;}