@charset "utf-8";

@font-face{
	font-family: 'SamsungOneKorea';
	src: url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.eot');
	src: url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.eot?#iefix') format("embedded-opentype"),
	url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.woff2') format("woff2"),
	url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.woff') format("woff"),
	url('./skin5/font/SamsungOneKorean-400-v1.2-20190628.svg') format("svg");
	font-weight: normal;
	font-style: normal;
}
@font-face{
	font-family: 'SamsungOneKorea';
	src: url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.eot');
	src: url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.eot?#iefix') format("embedded-opentype"),
	url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.woff2') format("woff2"),
	url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.woff') format("woff"),
	url('./skin5/font/SamsungOneKorean-700-v1.2-20190628.svg') format("svg");
	font-weight: bold;
	font-style: normal;
}

body{margin:0;padding:0;font-family:SamsungOneKorea;font-weight:normal;font-size:12px;}
ul, li, h1{margin:0;padding:0;list-style:none;}

div#wrapper{width:100%;height:100%;background-color:#ffffff;}


.header{position:fixed;left:0;top:0;width:100%;height:80px;padding:0;line-height:80px;background-color:#f7f7f7;}
.header:after{display:block;content:'';clear:both;}
.top{width:calc(100% - 30px);height:calc(80px - 24px);margin:0 auto;padding:24px 15px 0 15px;}
h1.logo{float:left;width:120px;height:34px;}
h1.logo a{display:block;width:120px;height:34px;text-align:center;line-height:34px;}
h2.title{margin:0 auto;padding:0;}
.nav{float:left;}
.tabs{width:auto;height:34px;padding-left:24px;}
.tabs > li{float:left;width:auto;font-size:14px;padding:0 12px;}
.tabs > li a{display:block;width:auto;height:34px;text-align:center;line-height:34px;text-decoration:none;color:#000;font-weight:bold;}

.section{position:absolute;left:0;top:80px;display:table;width:calc(100% - 40px);height:calc(100% - 185px);padding:20px 15px 20px 15px;overflow:auto;}
.section2{position:static;left:0;top:80px;display:table;width:calc(100% - 40px);height:calc(100% - 185px);padding:100px 15px 100px 15px;overflow:auto;}
.booksect{display:table-cell;vertical-align:middle;width:100%;height:100%;margin:auto;}
.booksect h2{width:100%;}
.booklist{width:100%;margin:20px auto;}
.booklist > li{text-align:center;font-size:15px;}
.item1 > ul > li{width:80%;max-width:173px;margin:20px auto 0 auto;}
.item1 > ul > li img{width:100%;}
.item1 > h2.title{width:173px;margin:0 auto;padding:0;}
.item4 > ul > li{float:left;width:calc(100% / 4);}
.item4 > ul > li img{width:80%;max-width:173px;}
.item4 > h2.title > p{width:calc(100% / 4);text-align:center;}
.item4 > h2.title > p > span{margin-right:58px;}
.item4a > ul > li{float:left;width:calc(100% / 4);}
.item4a > ul > li img{width:80%;max-width:250px;max-height:140px;}
.item4a > h2.title > p{width:100%;max-width:1300px;text-align:left;margin:0 auto;}
.item4a > h2.title > p > span{margin-right:58px;}
.item5 > ul > li{float:left;width:calc(100% / 4);height:335px;}
.item5 > ul > li img{width:80%;max-width:173px;min-height:245px;}
.item6 > ul > li{float:left;width:calc(100% / 6);}
.item6 > ul > li img{width:80%;max-width:173px;}

.item6a > .bk6 {margin-bottom:30px;}
.item6a > .bk6 > li{float:left;width:calc(100% / 4);height: /*335px*/ auto;background-color: #f4f4f4;}
.item6a > ul:first-child > li{width:calc(100% / 4 - 15px);}
.item6a > ul:first-child > li:nth-child(2){margin-left:30px;}
.item6a > ul:first-child > li:nth-child(3){margin-right:30px;}
.item6a > .bk6 > li img{width:80%;max-width:173px;min-height:245px;}
.item6a > .bk6 > li > h2 {text-align: left;max-width: 173px;}
.item6a > .bk6 > li > .ht2 > p > span {color:#ffffff;}

.booklist > li img{border:1px solid #e0e0e0;box-shadow:2px 2px 4px #dbdbdb;}
.booklist:after{display:block;content:'';clear:both;}

h2.title2{width:173px;margin:40px auto 0 auto;}
.booklist2{width:173px;margin:20px auto;}
.booklist2 > li{width:173px;text-align:center;font-size:15px;}
.booklist2 > li img{width:100%;max-width:173px;border:1px solid #e0e0e0;box-shadow:2px 2px 4px #dbdbdb;}

.footer{position:fixed;left:0;bottom:0;width:100%;background-color:#fff;border-top:1px solid #ddd;}
.footer > p{width:calc(100% - 30px);100%;height:auto;margin:0 auto;padding:20px 15px 20px 15px;color:#363636;}

.mmpopbtn5mD657b{display:none;}
.mmpopbtn5mD657b > a{display:block;width:80px;height:80px;text-align:center;}
.mmpopbtn5mD657b > a > img{vertical-align:middle;}
.sidenav {height: 100%;width: 0;position: fixed;z-index: 999;top: 0;right: 0;background-color: #fff;overflow-x: hidden;transition: 0.5s;padding-top: 40px;font-size:15px;}
.sidenav a {padding: 5px 5px 5px 40px;text-decoration: none;color: #000;display: block;transition: 0.3s;}
.sidenav .closebtn {position: absolute;top: 0;right: 25px;margin-left: 50px;padding:8px 0 0 40px;}
.bbg{z-index:998;width:100%;height:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,0.7);transition: 0.5s;overflow:hidden;display:none;}
.tabsm > li{line-height:30px;}
.tabsm > li:first-child{margin-top:40px;}

@media(min-width:2400px){
.item1 > h2.title{width:260px;}
.item1 > ul > li{max-width:260px;}
.item4 > h2.title{max-width:1950px;}
.item4 > ul > li img{max-width:260px;}
.item4a > ul > li img{max-width:300px;}
.item5 > ul > li img{max-width:260px;}
.item6 > ul > li img{max-width:260px;}
.booklist{max-width:1950px;}
}

@media(max-width:1960px){
.item4 > h2.title{max-width:1300px;}
.booklist{max-width:1300px;}
#tab3 > .footer{position:static;}
#tab3 > .section{position:static;margin-top:100px;}

#tab5 > .footer{position:static;}
#tab5 > .section{position:static;margin-top:100px;}

#tab6 > .footer{position:static;}
#tab6 > .section{position:static;margin-top:100px;}
}

/*@media(max-width:1600px){
.header{position:static;}
.section{position:static;}
.footer{position:static;}
}*/

@media(max-width:1080px){
#tab3 > .footer{position:static;}
#tab3 > .section{position:static;margin-top:100px;}
}

@media(max-width:900px){
.item4 > h2.title > p{width:calc(100% / 1);text-align:left;}
.item4 > h2.title > p{margin-right:0;margin-left:20px;}
.booklist > li{width:calc(100% / 3);}
}

@media(max-width:414px){
.booklist > li{width:calc(100% / 1);}
.mmpopbtn5mD657b{display:inline;position:absolute;top:0px;right:0px;z-index:999;}
.item4 > ul > li{float:left;width:calc(100% / 1);}
.item4 > h2.title{width:173px;margin:0 auto;padding:0;}
.item4 > h2.title > p{width:calc(100% / 1);text-align:left;margin-left:0;}
.item4 > h2.title > p > span{margin-right:0;}
.item4a > ul > li{float:left;width:calc(100% / 1);}
.item5 > ul > li{float:left;width:calc(100% / 1);}

#tab6 > .section{margin-top:0px;}
.item6a > .bk6 {margin:0px auto;}
.item6a > .bk6 > li{float:left;width:calc(100% / 1);background-color: #fff;}
.item6a > ul:first-child > li {width:calc(100% / 1);}
.item6a > ul:first-child > li:nth-child(2),.item6a > ul:first-child > li:nth-child(3) {margin:0px auto;}

#tab5 > .section{position:static;margin-top:20px;}
.nav{display:none;}
.header{position:static;}
.section{position:static;}
.footer{position:static;}
}




/* 마우스오버 효과 */
.tabs li a,.tabs li a:visited,.tabs li a:hover,.tabs li a:active{
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
	position:relative;
  transition:0.5s color ease;
	color:#000;
}
.tabs li a:hover{color:#000;}
.tabs li a.before:before, .tabs li a.after:after{
  content: "";
  transition:0.5s all ease;
  -webkit-backface-visibility:hidden;
          backface-visibility:hidden;
  position:absolute;
}
.tabs li a.after:after{bottom:0;}
.tabs li a.before:before, .tabs li a.after:after{height:1px;width:0;background:#000;}
.tabs li a.mbtn:after{
  left:0%;
  -webkit-transform:translateX(0%);
          transform:translateX(0%);
}
.tabs li a.before:hover:before, .tabs li a.after:hover:after{width:100%;}
.tabs li.active > a.after:after{width:100%;}