/* @import url("reset.css"); */


.wrapper { 
	width : 100%; 
	position: relative;
	min-height: 100vh;
}

.container {
	padding-bottom: 70px;
}
@font-face {
	font-family: ibm;
	font-style: normal;
	font-weight: 200;
	src: url('font/IBMPlexSansKR-Light.eot');
	src: url('font/IBMPlexSansKR-Light.eot?#iefix') format('embedded-opentype'),
		 url('font/IBMPlexSansKR-Light.woff') format('woff'),
		 url('font/IBMPlexSansKR-Bold.ttf') format('truetype');
}

@font-face {
	font-family: ibm;
	font-style: normal;
	font-weight: 400;
	src: url('font/IBMPlexSansKR-Regular.eot');
	src: url('font/IBMPlexSansKR-Regular.eot?#iefix') format('embedded-opentype'),
		 url('font/IBMPlexSansKR-Regular.woff') format('woff'),
		 url('font/IBMPlexSansKR-Regular.ttf') format('truetype');
}
/* semi-Bold */
@font-face {
	font-family: ibm;
	font-style: normal;
	font-weight: 600;
	src: url('font/IBMPlexSansKR-Medium.eot');
	src: url('font/IBMPlexSansKR-Medium.eot?#iefix') format('embedded-opentype'),
		 url('font/IBMPlexSansKR-Medium.woff') format('woff'),
		 url('font/IBMPlexSansKR-Medium.ttf') format('truetype');
}
/* Bold */
@font-face {
	font-family: ibm;
	font-style: normal;
	font-weight: 900;
	src: url('font/IBMPlexSansKR-Bold.eot') format('eot');
	src: url('font/IBMPlexSansKR-Bold.eot?#iefix') format('embedded-opentype'),
		 url('font/IBMPlexSansKR-Bold.woff') format('woff'),
		 url('font/IBMPlexSansKR-Bold.ttf') format('truetype');
}						

/*========================================================================================================================
	guaid
==========================================================================================================================
*/
.mgb5 {
	margin-bottom:5px !important
}
.mgb10{
	margin-bottom:10px !important
}
.mgb20{
	margin-bottom:20px !important
}
.mgb30{
	margin-bottom:30px !important
}
.mgb40{
	margin-bottom:40px !important
}
.mgb50{
	margin-bottom:50px !important
}
.mgb60{
	margin-bottom:60px !important
}
.mgb70{
	margin-bottom:70px !important
}
.mgb80{
	margin-bottom:80px !important
}
.mgb90{
	margin-bottom:90px !important
}
.mgb100 {
	margin-bottom:100px !important
}
.pd170 {
	padding-bottom:170px !important
}


.mgt5{
	margin-top:5px !important
}
.mgt10{
	margin-top:10px !important
}
.mgt20{
	margin-top:20px !important
}
.mgt30{
	margin-top:30px !important
}
.mgt40{
	margin-top:40px !important
}
.mgt50{
	margin-top:50px !important
}
.mgt60{
	margin-top:60px !important
}
.mgt70{
	margin-top:70px !important
}
.mgt80{
	margin-top:80px !important
}
.mgt90{
	margin-top:90px !important
}
.mgt100{
	margin-top:100px !important
}

/*margin-left*/
.mgl10{
	margin-left:10px !important
}
.mgl20{
	margin-left:20px !important
}
.mgl40{
	margin-left:40px !important
}
.mgl50{
	margin-left:50px !important
}
.mgl60{
	margin-left:60px !important
}
.mgl70{
	margin-left:70px !important
}
.mgl80{
	margin-left:80px !important
}
.mgl90{
	margin-left:90px !important
}
.red {
	color:#cc6960
}
input[placeholder]{
	font-size:14px
}
textarea[readonly]{
	background-color: #f7f7f7;
}
input[readonly]{
	background-color: #f7f7f7;
}
input[disabled]{
	background-color: #f7f7f7;
}
input[type=file]{
	display: none;
}

input[type=file] + label {

}
input[type=checkbox] + label{
	
}
button {
	text-align: center;
	padding:10px 20px;
	font-weight: 800;
	background-color: #3c53f4;
	color: #fff;
	border-radius: 3px;
}
.conts{
	width: 100%;
	max-width: 940px;
	margin: 0 auto;
}
/* input[type=text],input[type=password],input[type=number] {
	height: 32px;
	padding: 3px 10px;
	border: 1px solid #e6e5ec;
	border-radius: 4px;
}
input[type=checkbox]{
	text-indent: -9999px;
	width:0;
	height: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: none;
}
input[type=checkbox] + label{
	padding-left:25px;
	position: relative;
	vertical-align: middle;
	font-size: 14px;
	display: inline-block;
}
input[type=checkbox] + label::before{
	content: "";
	width:16px;
	height: 16px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	background-image:url(../img/checkbox.png) ;
	left:0;
	top: calc( 50% - 8px );
}
input[type=checkbox] + label.top::before{
	top: 0;
}

input[type=checkbox]:checked + label::before{
	background-image: url(../img/checkbox_on.png);
} */


/*
=======================================================================
header
=======================================================================
*/
header .head-cont {
	width: 100%;
	max-width: 940px;
	margin: 0 auto;
	color: #fff;
	padding: 20px 0;
}
header .head-cont a {
	color: #fff;
	font-size: 12px;
}
.head-wrap{
	background-color:#3c53f4 ;
}
header .head-cont .logo {
	margin-right: 20px;
}
header .head-cont .left{
	float: left;
	line-height: 32px;
}
header .head-cont .left > div {
	float: left;
	vertical-align: middle;
}
header .head-cont .left > div.logo img{
	float: left;
}
header .head-cont .right{
	float: right;
}
header .head-cont .left > div.best{
	line-height: 42px;
}
header .head-cont .right ul li {
	float: left;
	vertical-align: middle;
	padding: 0 10px;
	line-height: 42px;
}
header .head-cont .left .search {
	background-color: #fff;
	width: 300px;
	height: 32px;
	border-radius: 60px;
	margin-right: 26px;
	margin-top: 4px;
} 
header .head-cont .left .search {
	
}
header .head-cont .left .search input {
	width: 100%;
	border: none;
	background-color: none;
	border-radius: 60px;
	padding-left: 40px;
	display: inline-block;
	height: 32px;
	background: url(../img/icon_sh.png) no-repeat 5% center;
	font-size: 12px;
}
header .head-cont .left .search input::placeholder {
	color: #454a69;
}
header .gnb{
	background-color: #f2f2f8;
	box-shadow: inset 0 -2px 4px 0 rgba(21, 21, 23, 0.15);
}
header .gnb ul {
	width: 100%;
	max-width: 940px;
	margin: 0 auto;
	display: table;
} 
header .gnb ul li a {
	font-size: 12px;
	font-weight: 600;
	color: #2f3242;
	
}
header .gnb ul li {
	display: table-cell;
	padding: 20px 0;
	text-align: center;
}
/*
=======================================================================
footer
=======================================================================
*/
.footer {
	background-color: #2f3242;
	color: #c3c7eb;
	font-size: 9px;
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100vw;
}
.footer a {
	color: #c3c7eb;
	font-size: 9px;
}
.footer .footer-conts {
	width: 100%;
	max-width: 940px;
	margin: 0 auto;
	display: table;
	padding: 20px 0;
}
.footer .footer-conts > div {
	display: table-cell;
}
.footer .footer-conts .tb {
	display: table;
	max-width: 350px;
	width: 100%;
	text-align: center;
	
}
.footer .footer-conts .tb > li {
	display: table-cell;
}
/*
=======================================================================
main
=======================================================================
*/
.main .banner-main .swiper-slide{
	overflow: hidden;
	
}
.main .banner-main .swiper-slide > img {
	float: left;
}
.main .banner-main .swiper-slide::after{
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	background-color: rgba(0,0,0,0.4);
	z-index: 2;
}

.main .banner-main .swiper-slide::after{
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	background-color: rgba(0,0,0,0.4);
	z-index: 2;
}
.main .banner-main .swiper-slide.swiper-slide-active::after{
	background-color: rgba(0,0,0,0);
}
.main .banner-main .swiper-button-next {
	background: url(../img/arr-right.png) no-repeat center / contain;
	right: 21%;
}
.main .banner-main .swiper-button-prev {
	background: url(../img/arr-left.png)no-repeat center / contain;
	left: 21%;
}
.edition .swiper-container-horizontal>.swiper-pagination-bullets{
	bottom:4px
}
.edition  .swiper-pagination-bullet {
	width: 6px;
	height: 6px;
}

.main .banner-best .swiper-button-next {
	right: 23%;
}
.main .banner-best .swiper-button-prev {
	left: 23%;
}
.main .edition .swiper-button-next{
	right: -50px;
}
.main .edition .swiper-button-prev{
	left: -50px;
}

.main .banner-best .swiper-slide .tb > div {
	text-align: center;
	position: relative;
	padding: 0 30px;
}
.main .banner-best .swiper-slide .tb > div p {
	font-size: 12px;
	color: #2f3242;
	margin-top: 5px;
}
.main .banner-best .swiper-slide .tb > div p.tit{
	font-weight: bold;
	margin-top: 0;
	padding-top: 20px;
}
.main .banner-best .swiper-slide .tb > div img {
	margin-top: 20px;
	box-shadow: 0px 5px 10px rgba(0,0,0,0.3);
}
.main .banner-best .swiper-slide .tb > div button{
	height: 30px;
	line-height: 30px;
	padding: 0;
	width: 80%;
	font-size: 12px;
	  font-weight: bold;
	  margin-top: 30px;
	  background-color: #c3c7eb;
}
.main .banner-best .swiper-slide .tb > div .bg {
	position: absolute;
	width: 80%;
	height: 65%;
	display: inline-block;
	border: 8px solid #c3c7eb;
	top: 0;
	left: 10%;
	z-index: -1;
}
.main .banner-best .swiper-slide.swiper-slide-active .tb > div .bg{
	border: 9px solid #3c53f4;
}
.main .banner-best .swiper-slide.swiper-slide-active .tb > div button{
	background-color: #3c53f4;
}
.main .edition .cont-wrap{

}
.main .edition .cont-wrap > div {
	float: left;
	width: 75%;
}
.main .edition .cont-wrap > div:first-child{
	width: 25%;
}
.main .recomend-index {
	color: #fff;
	background:url(../img/bg-main01.png) no-repeat center / cover
}
.main .main-hash {
	background-color:#f2f2f8;
}
.main .main-hash .conts span{
	font-size: 12px;
	font-weight: bold;
	border-radius: 12px;
	background-color: #3c53f4;
	margin-left: 10px;
	vertical-align: middle;
	color: #fff;
	display: inline-block;
	line-height: 24px;
	padding: 0 10px;
}
.main .main-hash .conts{
	padding: 15px 0;
}
.main .main-hash .conts span.tit{
	font-size: 18px;
	font-weight: bold;
	color: #2f3242;
	margin-right: 20px;
	margin-left: 0;
	padding: 0;
	padding-left: 30px;
	background : url(../img/fire.png)no-repeat 0 center ;
}
.main h3 {
	line-height:60px;
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	margin: 20px 0 ;
}
.main .banner-best{
	padding: 30px 0 60px 0;
}
.main .banner-best h3 {
	padding-top: 35px;
	background: url(../img/crown.png) no-repeat center top;

}
.main .recomend{
	padding: 30px 0 60px 0;
}
.main .recomend h3{
	padding-top: 35px;
	background: url(../img/stars.png) no-repeat center top;
}
.main .edition {
	
	background: url(../img/edition-bg.png) no-repeat center / contain;
	padding: 100px 0 100px 0;
}
.main .edition .conts {
	padding: 40px 0 30px 40px;
}
.main .edition .menu{
	padding-right: 20px;
}
.main .edition .menu > div {
	box-shadow: 0 4px 6px 0 rgba(21, 21, 23, 0.15);
	  background-color: #fff;
	  padding: 10px;
	  font-size: 18px;
	  font-weight: bold;
}
.main .edition .menu > div ul li {
	margin-bottom: 5px;
	padding-left : 20px;
	position: relative;
}
.main .edition .menu > div ul li.on::after{
	content: "";
	position: absolute;
	left: 0;
	top: 5px;
	width: 4px;
	height: 20px;
	background-color: #3c53f4;
}
.main .edition .menu > div ul li.on{
	color: #3c53f4;
}
.main .edition .menu > div ul li:last-child{
	margin-bottom: 0;
}
.main .edition .banner {
	padding: 0 80px;
}
.main  .recomend-index {
	padding-top: 340px;
	padding-bottom: 100px;
	margin-top: -300px;
	z-index: 0;
}
.main  .recomend-index .contents p{
	font-size: 12px;
}
.main  .recomend-index .contents p.tit {
	font-size: 18px;
	font-weight: bold;
}
.main  .recomend-index .row .tb > div{
	padding-right: 10px;
	position: relative;
}

.main  .recomend-index .row .tb > div:first-child{
	padding: 10px 20px 10px 80px ;
	background: url(../img/img-checked.png) no-repeat left top;
}
.main  .recomend-index .row .tb button{
	height: 48px;
	line-height: 48px;
	padding:  0 30px ;
	font-size: 18px;
	font-weight: bold;
	background-color: #fff;
	color: #3c53f4;
	border-radius: 34px;
	position: absolute;
	bottom: 20px;
}
.main  .img-swiper-bg {
	padding: 60px 0 100px ;
	background: url(../img/bg-imgsp.png) no-repeat center / cover;
}
.main  .img-swiper-bg h3 {
	margin-top: 0;
	line-height: 40px;
	margin-bottom: 40px;
}
/*
=======================================================================
result
=======================================================================
*/
.container .result {
	text-align: center;
	max-width: 300px;
	margin: 0 auto;
}
.result .small{
	font-size: 12px;
	color: #2f3242;
}
.result .main-cmt{
	font-size: 28px;
	color: #2f3242;
	font-weight: bold;
	margin: 20px 0 40px 0;
}
.result .add {
	font-size: 9px;
	color: #6971a3;
	text-align: left;
	margin-top: 40px;
}
.result .img_check {
	margin-top: 15vh;
}
.result button {
	width: 180px;
	height: 40px;
	font-size: 20px;
	font-weight: 900;
	padding: 0;
	line-height: 40px;
}
.tb {
	display: table;
	width: 100%;
}
.tb.t15 > div:first-child{
	width: 15%;
}
.tb.t20 > div:first-child{
	width: 20%;
}
.tb.t30 > div:first-child{
	width: 30%;
}
.tb.t50 > div:first-child{
	width: 50%;
}
.tb.t70 > div:first-child{
	width: 70%;
}
.tb.t80 > div:first-child{
	width: 80%;
}

.tb > div{
	display: table-cell;
	vertical-align: top;
}
.tb > div.center{
	text-align: center;
}
.tb > div.right{
	text-align: right;
}
.tb.middle > div{
	vertical-align: middle;
}
/*
=======================================================================
detail
=======================================================================
*/
.shop-detail{
	margin-top: 60px;
}
.shop-detail .book-info .book-img{
	 width: 240px;
	 height: 300px;
	 border: 9px solid #f2f2f8;
	 border-end-end-radius: 3px;
}
.shop-detail .book-info > div:nth-of-type(1){
	width: 240px;
}
.shop-detail .book-info > div:nth-of-type(3){
	width: 25%;
	background-color: #f2f2f8;
	border-radius: 16px;
	padding: 10px;
}

.shop-detail .book-info .big-pt{
	text-align: center;
}
.shop-detail .book-info .big-pt button{
	color: #454a69;
	font-size: 12px;
	background-color: #f2f2f8;
	padding: 5px 10px;
	border-radius: 5px;
	margin:10px 0 15px 0
}
.shop-detail .book-info .sns-wrap {
	display: table;
	width: 100%;
}
.shop-detail .book-info .sns-wrap li{
	display: table-cell;
	width: 20%;
	padding-top: 40px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.shop-detail .book-info .sns-wrap li.fb{
	background-image: url(../img/icon_fb.png);
}
.shop-detail .book-info .sns-wrap li.is{
	background-image: url(../img/icon_is.png);
}
.shop-detail .book-info .sns-wrap li.tw{
	background-image: url(../img/icon_tw.png);
}
.shop-detail .book-info .sns-wrap li.kt{
	background-image: url(../img/icon_kt.png);
}
.shop-detail .book-info .sns-wrap li.lk{
	background-image: url(../img/icon_lk.png);
}
.shop-detail .book-info .hash {
	margin-bottom: 10px;
}
.shop-detail .book-info .hash span{
	color: #10b2ff;
	font-size: 12px;
	font-weight: 900;
	display: inline-block;
	margin-right: 20px;
}
.shop-detail .book-info .title {
	font-size: 28px;
	  font-weight: bold;
	  padding-left:20px;
	  position: relative;
}
.shop-detail .book-info .title::after{
	content: "";
	position: absolute;
	top: 5px;
	left: 0;
	width: 1px;
	height: 40px;
	background-color: #3c53f4;

}
.shop-detail .add-info{
	font-size: 9px;
	color: #6971a3;
	padding-top: 20px;
}
.shop-detail .add-info > div:first-child{
	font-weight: 900;
}
.shop-detail .book-info .price{
	border-bottom: 1px solid #e6e5ec;
	padding-bottom: 20px;
}
.shop-detail .book-info .price .tb > div{
	font-size: 18px;
	font-weight: 900;
}
.shop-detail .book-info .price .tb:nth-of-type(1) > div:last-child{
	color: #b7b7b7;
}
.shop-detail .book-info .price .tb:nth-of-type(3) > div:last-child{
	color: #10b2ff;
}
.shop-detail .book-info > div:nth-of-type(2){
	padding: 0 60px;
}
.shop-detail .book-info .btn-list{
	overflow: hidden;
}
.shop-detail .book-info .btn-list button{
	font-size: 20px;
	font-weight: 600;
	float: left;
	padding: 10px 0;
}
.shop-detail .book-info .btn-list button:nth-of-type(1) {
	background-color: #f2f2f8;
	color: #3c53f4;
	width: calc( 20% - 10px);
	margin-right:15px
}
.shop-detail .book-info .btn-list button:nth-of-type(2) {
	background-color: #10b2ff;
	color: #fff;
	width: calc( 45% - 10px);
	margin-right:15px
}
.shop-detail .book-info .btn-list{
	margin-top: 55px;
}
.shop-detail .book-info .btn-list button:nth-of-type(3) {
	background-color: #3c53f4;
	color: #fff;
	width: calc( 35% - 10px);
}
.shop-detail .add{
	font-size: 12px;
	color:#454a69 ;
	margin: 16px 0 24px 0;
}
.shop-detail .info-item {
	margin: 20px 0;
}
.shop-detail .info-item .tit{
	font-size: 18px;
	font-weight: bold;
	line-height: 60px;
	height: 60px;
	padding-left: 50px;
	background: url(../img/icon_aco.png) no-repeat 10px center ;
	border-bottom: 1px solid #e6e5ec;
}
.shop-detail .info-item .gray-box {
	border-radius: 10px;
	background-color: #f2f2f8;
	font-size: 12px;
	color: #454a69;
	padding: 16px;
}
.shop-detail .scroll {
	background: #e6e5ec;
	padding: 0 60px;
	border: 2px solid #e6e5ec;
	height: 460px;
	overflow-y: auto;
}
.shop-detail .scroll .box{
	padding: 60px 100px;
	font-size: 18px;
	background-color: #fff;
}
.shop-detail .select-part .list label{
	color: #9193a2;
	font-size: 9px;
	font-weight: 900;
}
.shop-detail .select-part .list {
	background: #fff;
	padding: 15px 10px;
	background: #fff;
    padding: 15px 10px;
    margin-top: 10px;
    border: solid 1px
 #e6e5ec;
    border-radius: 4px;
}
.shop-detail .info-item .editor{
	font-size: 28px;
	font-weight: bold;
	padding-left: 20px;
	position: relative;
	line-height: 4px;
}
.shop-detail .info-item .editor::after{
	content: "";
	position: absolute;
	width: 1px;
	height: 40px;
	top: 6px;
	left: 0;
	background:#3c53f4 ;
	
}
.shop-detail .info-item .editor span{
	font-weight: 900;
    font-size: 12px;
    color: #3c53f4;
    margin-bottom: 27px;
    display: inline-block;

}
.shop-detail .info-item .cont{
	padding-top: 20px;
}
.shop-detail .gray-box {
	overflow: auto;
}

.shop-detail .star-zone .star-num{
	font-size: 36px;
	width: 140px;
	height: 116px;
	display: inline-block;
	line-height: 116px;
	text-align: center;
	font-weight: 900;
	background: url(../img/bg_star.png) no-repeat center / contain;
}
.other-book .title button{
	padding: 6px 10px;
	border-radius: 8px;
	background-color: #f2f2f8; 
	font-size: 12px;
	font-weight: bold;
	color: #454a69;
	margin-top: 20px;
}
.pagenation ul {
	margin-top: 20px;
}
.pagenation ul li {
	color: #c3c7eb;
	font-size: 12px;
  	font-weight: bold;
	margin-right: 10px;
}
.pagenation ul li.on {
	color:#10b2ff
}
/*
=======================================================================
common
=======================================================================
*/
.stars span.star {
	display: inline-block;
	width: 24px;
	height: 24px;
	background: url(../img/star.png) no-repeat center / contain;
	vertical-align: middle;
}
.stars span.star.on{
	background: url(../img/star_full.png) no-repeat center / contain;
}
.stars span.star.half{
	background: url(../img/star_half.png) no-repeat center / contain;
}
.stars.small span.star {
	width: 16px;
	height: 16px;
}
.pz-table{
	border-top: 2px solid #e6e5ec ;
	border-bottom: 2px solid #e6e5ec ;
}
.pz-table td {
	padding: 15px 0;
	font-size: 12px;
	border-bottom: 1px solid #e6e5ec;
}
.pz-table td.date{
	font-size: 9px;
	color: #6971a3;
}
.pz-table th {
	font-size: 12px;
	font-weight: bold;
	border-bottom: 1px solid #e6e5ec;
	padding: 20px 0;
	text-align: left;
}
.pz-table th.center{
	text-align: center;
}
.pagenation ul{
	text-align: center;
}
.pagenation ul li {
	display: inline-block;
}

.img-list ul li {
	float: left;
	width: calc(20% - 16px);
	margin-right: 20px;
	margin-bottom: 20px;
}

.img-list.arr6 ul li {
	width: calc(16% - 14px);
}
.img-list.arr4 ul li {
	width : calc( 25% - 15px )
}

.img-list ul li:nth-of-type(5n){
	margin-right: 0;
}
.img-list.arr6 ul li:nth-of-type(5n){
	margin-right: 20px;
}

.img-list.arr4 ul li:nth-of-type(5n) {
	margin-right: 20px;
}
.img-list.arr6 ul li:nth-of-type(6n){
	margin-right: 0;
}
.img-list.arr4 ul li:nth-of-type(4n){
	margin-right: 0;
}
.img-list ul li{
	text-align: center;
	font-size: 12px;
}
.img-list .book-tit{
	font-size: 12px;
	margin: 10px 0 14px 0;
	text-align: center;
}
.img-list .book-add{
	font-size: 9px;
	text-align: center;
}

.more-type {
	text-align: center;
}
.more-type button{
	width: 140px;
	height: 30px;
	font-size: 12px;
	line-height: 30px;
	padding: 0;
	margin-top: 20px;
	border-radius: 5px;
}

.swiper-container{
	width: 100%;
}
.bg-gray {
	background-color: #f2f2f8;
}

/*
=======================================================================
검색결과
=======================================================================
*/

.search-result .search-sm{
	font-size: 18px;
	font-weight: 900;
}
.search-result .search-sm span{
	color: #3c53f4;
}
.search-result .top .title{
	font-size: 36px;
	font-weight: bold;
	padding-left: 20px;
	position: relative;
}
.search-result .top .title::after{
	content: "";
	position: absolute;
	width: 1px;
	height: 36px;
	background: #3c53f4;
	left: 0;
	top: 0;
}

.search-result .scroll-area {
	height: 350px;
	overflow-y: hidden;
	position: relative;
}
.search-result .scroll-area::after{
	content: "";
	width: 100%;
	height: 70px;
	background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
	position: absolute;
	bottom: 0;
	left: 0;
}
.search-result .top.tb .book-add{
	width: 25%;
	padding-left: 20px;
}
.search-result .book-add .tb div:first-child{
	color: #3c53f4;
	font-weight: 600;
	width: 30%;
}
.search-result .book-add .tb > div{
	font-size: 12px;
	padding-bottom: 5px;
}
.search-result .book-add .book-info{
	margin: 20px 0;
}
.btn.type02{
	border-radius: 8px;
	border: solid 1px #3c53f4;
	color: #3c53f4;
	font-size: 20px;
	font-weight: bold;
	background-color: #fff;
	width: 100%;
	padding: 0;
	line-height:60px;
	height: 60px;
}
.search-result .more-type button{
	margin-top: 0;
}
.search-result .other{
	background-color: #f2f2f8;
	padding: 40px 0 80px 0;
}
.search-result .other .swiper-slide > div{
	background-color: #fff;
	padding: 16px;
	position: relative;
	border: 1px solid #e6e5ec;
	min-height: 150px;
}
.search-result .other .swiper-slide .small{font-size: 12px;}
.search-result .other .swiper-slide .big{font-size: 18px; font-weight: 900; margin-bottom: 5px;}
.search-result .other .swiper-slide .hash{color:#10b2ff ;font-size: 12px; font-weight:900;}
.search-result .other .swiper-slide .hash span{
	margin-right: 5px;
}
.search-result .other .swiper-slide .share{
	position: absolute;
	bottom: 10px;
	right: 16px;
	width: 13px; height: 14px; display: inline-block; 
	background: url(../img/icon_share.png) no-repeat center / contain;
}
.search-result .other .swiper-slide .date{
	font-size: 9px;
	position: absolute;
	left: 16px;
	bottom: 10px;
}
.search-result .other .mid-tit {
	font-size: 18px;
	font-weight: 900;
	padding-left: 30px;
	background: url(../img/icon_sh.png) no-repeat left center ;
	margin-bottom: 20px;
}
.front-big {
	font-size: 28px;
	font-weight: 900;
	padding-left :50px;
}
.front-big.f-book {
	background: url(../img/icon_book.png) no-repeat left center ;
	margin-bottom: 35px;
}
.front-big.f-pz {
	background: url(../img/icon_pz.png) no-repeat left center ;
	margin-bottom: 35px;
}
.front-big.f-bs01{
	background: url(../img/icon_f03.png) no-repeat left center ;
	margin-bottom: 35px;
}

.front-big.f-bs02 {
	background: url(../img/icon_f03.png) no-repeat left center ;
	margin-bottom: 35px;
}
.search-result  .bg-gray {
	padding: 36px 0 20px;
}
.vertical-list .tb {
	border: solid 1px #e6e5ec;
}
.vertical-list .tb .book {
	width: 57px;
	overflow: hidden;
}
.vertical-list .tb .book img {
	float: left;
}
.vertical-list .tb .cont {
	padding: 20px;
}
.search-result .vertical-list .tb .cont p{
	font-size: 12px;
}
.search-result .vertical-list .tb .cont p:first-child {
	font-size: 18px;
	font-weight: 900;
}
.search-result .vertical-list .tb .cont p:first-child span {
	font-size: 12px;
	margin-left: 20px;
	font-weight: 400;
}
.search-result .vertical-list .tb{
	padding-left: 20px;
	margin-bottom: 20px;
}
.bg-blue {
	background: #e5e7f8;
}
.search-result .bg-blue.no-result{
	text-align: center;
	padding: 20px 0 30px 0;
}
.search-result .bg-blue.no-result .conts > p{
	font-size: 12px;
	font-weight: bold;
	padding-top: 30px;
	background: url(../img/icon_sh.png) no-repeat top center;
	margin-bottom: 20px;
	
}
.search-result .bg-blue.no-result button {
	background: #3c53f4;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	height: 30px;
	line-height: 30px;
	border-radius: 5px;
	padding: 0 20px;
}
/*
=======================================================================
해시태그
=======================================================================
*/
.page-title {
	font-size: 28px;
	font-weight: 900;
	margin: 100px 0 40px 0;
}
.hash .search-area {
	border: 1px solid #e6e5ec;
	padding: 20px 0;
	text-align: center;
}
.hash .search-area .search-tag {
	border-bottom: 2px solid #10b2ff;
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
	
}
.hash .search-area .search-tag input{ 
	border: none;
	width: 100%;
	padding-left: 40px;
	background: url(../img/icon_sh.png) no-repeat 10px center;
	height: 35px;
}
.hash .search-area .tags span {
	padding: 2px 10px ; border-radius: 30px;
	font-size: 12px;
	font-weight: 900;
	color: #10b2ff;
	border: 1px solid #e6e5ec;
	margin: 13px 5px 13px 0;
	display: inline-block;
}
.hash .search-area .tags span.on{
	color: #fff;
	background: #10b2ff;
	border: 1px solid #10b2ff;
}
.hash .re-title {
	font-size: 18px;
  	font-weight: bold;
	margin: 30px 0 20px ;
}
.hash .re-title span {
	color: #10b2ff;
	font-weight: 400;
	padding-left: 40px;
	position: relative;
}
.hash .re-title span::after{
	content: "";
	position: absolute;
	width: 1px;
	height: 20px ;
	background: #e6e5ec;
	left: 20px;
	top: 3px;
}
.list-type {
	border-top:1px solid #e6e5ec ;
}
.list-type li{
	border-bottom:1px solid #e6e5ec ;
	padding: 20px;
}
.list-type .img-zone{
	width: 108px;
}
.list-type .cont-zone {
	padding-left: 40px;
}
.list-type p {
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 8px;
}
.list-type p.tit {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}
.hash .list-type p .th{
	width: 70px;
	display: inline-block;
}

/*
=======================================================================
ë² ìŠ¤íŠ¸
=======================================================================
*/
.select {
	position: relative;
}
.select .option {
	display: none;
	position: absolute;
	width: 100%;
	z-index: 5;
	border: 1px solid #f1f1f1;
	background: #fff;
    border-radius: 10px;
    box-shadow: 5px 5px 10px rgb(0 0 0 / 10%);
}
.select .option > div {
	padding: 8px;
	font-size: 12px;
}

.select .selected{
	padding: 3px 8px 3px 10px;
	border-radius: 4px;
	border: solid 1px #e6e5ec;
	font-size: 12px;
	background-color: #fff;
}
.blue {
	color: #3c53f4;
}
.sky {
	color: #10b2ff;
}
.swiper-wrap {
	position: relative;
}
.best .img-list li {
	position: relative;
}
.best .img-list .lanking{
	font-size: 18px;
	font-weight: bold;
}
.best .img-list .top5 .lanking {
	position: absolute;
	background: url(../img/bg_best.png) no-repeat center;
	left: -10px;
	top: -16px;
	width: 68px;
	height: 48px;
	display: inline-block;
	color: #e5e7f8;
	font-size: 18px;
	font-weight: bold;
	padding: 7px 0 0 10px;
    text-align: left;
	z-index: 2;
}

.best .img-list .dim{
	position: absolute;
	top: 26px;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.6);
	color: #fff;
	text-align: center;
	padding : 50% 0;
	z-index: 1;
	opacity: 0;
	transform: scaleY(0);
	transition: all 0.2s ease-out;
}
.best .img-list .top5 .dim{
	top: 0;	
}
.best .img-list .dim.on{
	opacity: 1;
	transform: scaleY(100%)
}
.best .ct {
	padding: 30px 24px;
	border-radius: 20px;
	border: solid 2px #454a69;
	margin-bottom: 42px;
}
.best .ct > p {
	border-bottom:  1px solid #e6e5ec;
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.best .ct > div > span.on {
	font-weight: bold;
	color: #2f3242;
}
.best .ct > div > span {
	font-size: 12px;
	color: #2f3242;
	margin-right: 20px;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
	background : url(../img/nv_right.png) no-repeat center / contain;
	right: -70px
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
	background : url(../img/nv_left.png) no-repeat center / contain;
	left: -70px
}
.swiper-button-next, .swiper-button-prev{
	width: 20px;
    height: 40px;
}
/*
=======================================================================
마이페이지 메인
=======================================================================
*/
.lnb .head {
	font-size: 28px;
	font-weight: bold;
	padding: 44px 0 20px;
	margin-bottom: 40px;
	background: url(../img/icon-mm01.png) no-repeat left top;
}
.line-blue {
	position: relative;
	border-bottom: 1px solid #e6e5ec;
}
.line-blue::after{
	content: "";
	bottom: -1px;
	width: 60px;
	height: 1px;
	left: 0;
	position: absolute;
	background: #10b2ff;
} 
.line-blue.right::after{
	left: auto;
	right: 0;
}
.lnb{
	padding-right: 60px;
}
.lnb .lnb-list .dep01 {
	font-size: 28px;
  font-weight: bold;
}
.lnb .lnb-list .dep02{
	font-size: 18px;
	font-weight: bold;
	opacity: 0.6;
}
.lnb .lnb-list > div {
	margin-bottom: 40px;
}
.img-list.small ul li {
	width: calc(20% - 32px);
    margin-right: 40px;
}
.img-list.small ul li:nth-of-type(5n){
	margin-right: 0;
}

.my-main .my-info .tb > div {
	
	text-align: center;
	height: 220px;
	width: 25%;
	padding-top: 96px;
	position: relative;
}
.my-main .my-info .tb {
	background-color: #f2f2f8;
	overflow: hidden;
	border-radius: 20px ;
}
.my-main .my-info .tb > div > p{
	font-size: 18px;
	font-weight: bold;
}
.my-main .my-info .tb > div > a {
	font-size: 12px;
	color: #454a69;
	margin-top: 20px;
}
.my-main .my-info .tb > div:nth-of-type(2){
	background: url(../img/img-mm02.png) no-repeat center 30px ;
}
.my-main .my-info .tb > div:nth-of-type(3){
	
	background: url(../img/img-mm01.png) no-repeat center 30px ;
}
.my-main .my-info .tb > div:nth-of-type(4){
	background: url(../img/img-mm03.png) no-repeat center 30px ;
}
.my-main .my-info .tb > div:first-child{
	color: #e5e7f8;
	background-color: #3c53f4;
	padding-top: 40px;
}
.my-main .my-info .tb > div:first-child > p {
	font-size: 28px;
	font-weight: bold;
}
.my-main .my-info .btn-info {
	border-radius: 8px;
	border: solid 1px #fff;
	height: 30px;
	font-size: 12px;
  	font-weight: bold;
	padding: 0 20px;
	margin-top: 90px;

}
.bold-font {
	font-size: 28px;
	font-weight: bold;
}
.sm-bold-font {
	font-size: 18px;
	font-weight: bold;
}
.my-main .my-info .line-blue {
	padding: 20px 0;
}
.my-main .view-all {
	border-radius: 8px;
	background-color: #3c53f4;
	height: 30px;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	line-height: 30px;
	padding: 0 20px;
	float: right;
}
.my-main  .img-list {
	margin-top: 20px;
}
/*
=======================================================================
포인트
=======================================================================
*/
.point .compact {
	background-color: #e6e5ec;
	padding: 8px;
} 
.point .compact .right {
	font-size: 12px;
	font-weight: 900;
	line-height: 26px;
}
.point .compact .right > span:first-child {
	margin-right: 40px;
}
.point .point-now {
	padding:20px 0 20px 75px;
	background: url(../img/img-point.png) no-repeat left center ;
	margin-bottom: 15px;
}
.point .point-now .sky {
	margin-left:10px
}
/*
=======================================================================
 ì¿ í°
=======================================================================
*/

.coupon .cp-list li{
	border: solid 2px #e7ecfa;
	padding: 10px;
}
.coupon .cp-list li > div .big{
	font-size: 28px;
	font-weight: bold;
}
.coupon .cp-list li > div .add{
	font-size: 12px;
	margin-top: 10px;
}
.coupon .cp-list li > div:first-child{
	background: #e7ecfa;
	font-size: 24px;
	font-weight: bold;
	width: 150px;
	height: 150px;
}
.coupon .cp-list li > div:nth-of-type(2){
	padding-left: 40px;
}

/*
=======================================================================
찜
=======================================================================
*/

.zzim .zzim-list li {
	background: #f2f2f8;
	padding: 20px;
}
.zzim .zzim-list li .book-info{
	color: #6971a3;
	font-size: 9px;
	margin: 12px 0 21px 0;
}
.zzim .zzim-list li .index{
	background: #fff;
	padding: 15px;
}
.zzim .zzim-list li .index label {
	font-size: 12px;
	font-weight: 900;
}
.zzim .zzim-list li .tb .input-area {
	width: 120px;
	
}
.zzim .zzim-list li .tb .info-area{
	padding-left: 30px;
}
.zzim .zzim-list li .tb {
	margin-bottom: 15px;
}
.zzim .zzim-list .tags span{
	font-size: 12px;
	font-weight: bold;
	color: #10b2ff;
	background: #fff;
	border: solid 1px #e6e5ec;
	height: 24px;
	line-height: 24px;
	padding: 0 10px;
	border-radius: 30px;
	margin-right: 5px;

}
/*
=======================================================================
구매내역 
=======================================================================
*/
.order-list .item {
	background-color: #f2f2f8;
	padding: 15px 20px;
}
.order-list .item .date{
	color: #6971a3;
	font-size: 11px;
}
.order-list .item .tb .img{
	width: 124px;
}
.order-list .item .tb > div:nth-of-type(2){
	padding-left: 30px;
}

.order-list .item .tb .book-info {
	color: #6971a3;
	font-size: 9px;
	margin-top: 12px;
}

.order-list .item .index-list li {
	overflow: hidden;
	font-size: 12px;
}
.order-list .item .index-list li span {
	float: right;
	font-weight: bold;
}
.order-list .item .index-list .index-count {
	font-size: 12px;
	font-weight: bold;
}
.order-list .item .index-list > ul{
	position: relative;
	height: 200px;
	overflow: hidden;	
}
.order-list .item .index-list > ul::after{
	content: "";
	position: absolute;
	height: 50px;
	width: 100%;
	left: 0;
	bottom:0;
	background: linear-gradient(to bottom, rgba(242, 242, 248, 0),#f2f2f8);
}
.order-list .item  .more button{
	font-size: 9px;
	font-weight: normal;
	color: #6971a3;
	border: none;
	background: none;
	padding: 20px 0;
}
.order-list .item .date {
	overflow: hidden;
	margin-bottom: 12px;
}
.order-list .item .date > span:nth-of-type(2){
	float: right;
	color: #3c53f4;
	font-weight: bold;
}
.order-list .item .date > span a {
	font-size: 11px;
	font-weight: bold;
	margin-left: 20px;
}
/*
=======================================================================
내 서재
=======================================================================
*/
.library .book-list li {
	float: left;
	width: calc( 33% - 14px);
	margin-right: 20px;
	text-align: center;
	padding: 20px 10px;
	background-color: #f2f2f8;
	margin-bottom: 20px;
}
.library .book-list li:nth-of-type(3n) {
	margin-right: 0
}
.library .book-list li .tit {
	font-size: 18px;
	font-weight: bold;
	margin: 15px 0;
}
.library .book-list li 
.library .book-list li .info {
	font-size: 12px;
	font-weight: normal;
	color: #454a69;
	margin-bottom:15px ;
}
.library .book-list li .stars {
	padding: 0 10px;
}

/*
=======================================================================
내 서재 상세 
=======================================================================
*/

.library-detail .tb.item > div:first-child {
	text-align: center;
	padding-right: 20px;
}
.library-detail .tb > div:first-child .tit {
	font-size: 18px;
	font-weight: bold;
	margin: 15px 0 5px 0;  
}
.library-detail .tb > div:first-child .info {
	font-size: 12px;
	font-weight: normal;
	color: #454a69;
	margin-bottom: 10px;
}
.library-detail .tb > div:first-child .review {
	margin-top: 25px;
}
.library-detail .tb > div:first-child input {
	border: solid 1px #e6e5ec;
	height: 32px;
	width: calc( 100% - 80px);
	float: left;
	margin-right: 10px;
}
.library-detail .tb > div:first-child button {
	width: 70px;
	height: 32px;
	line-height: 32px;
	border-radius: 8px;
  	background-color: #3c53f4;
	padding: 0;
	font-size: 12px;
	font-weight: bold;
	float: left;
}
.library-detail .index-list{
	border-radius: 20px;
	  background-color: #f2f2f8;
	  padding: 20px 25px ;
}
.library-detail .index-list .tit {
	font-size: 18px;
	  font-weight: bold;
	  margin-bottom: 10px;
}
.library-detail .index-list ul {
	height: 264px;
	overflow-y: auto;
	background-color: #fff;
}
.library-detail .index-list ul li {
	padding: 5px 10px;
}
.library-detail .index-list .btm {
	text-align: right;
	margin-top: 10px;
}
.library-detail .index-list .btm button{
	height: 40px;
	line-height: 40px;
	border-radius: 8px;
	font-size: 20px;
	font-weight: bold;
	padding: 0 15px;
}
.library-detail .index-list .btm span{
	line-height: 40px;
	font-size: 12px;
	  font-weight: bold;
	  margin-right: 10px;
}
.library-detail .index-list .btm button.sky{
	background-color: #10b2ff;
	color: #fff;
}
/*
=======================================================================
장바구니
=======================================================================
*/
.bag .all-check {
	padding: 10px 20px;
}
.bag .all-check label {
	font-size: 12px;
}
.bag .all-check > div {
	float: left;
	font-size: 12px;
	line-height: 30px;
	font-size: 12px;
  font-weight: bold;
}
.bag .all-check > div:nth-of-type(2){
	float: right;
}
.bag .all-check button {
	font-size: 12px;
	font-weight: bold;
	height: 30px;
	padding: 0 15px;
	line-height: 30px;
}
.bag button.red {
	background-color: #eb5959;
	color: #fff;
}
.bag button.normal {
	font-size: 12px;
	font-weight: bold;
	height: 30px;
	padding: 0 15px;
	line-height: 30px;
}
.bag .book-item {
	padding-right: 20px;
}
.bag .book-item .book-tit{
	font-size: 18px;
	  font-weight: bold;
	  margin: 30px 0 12px 0;
}
.bag .book-item .book-info{
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 20px;
}
.bag .item {
	background-color: #f2f2f8;
	position: relative;
}
.bag .item .tb > div:first-child {
	width: 180px;
	padding:0  20px;
}
.bag .item .tb .index {
	height: 160px;
	overflow-y: auto;
	background-color: #fff;
	font-size: 12px;
  	font-weight: bold;
}
.bag .item .tb .index li {
	padding : 5px 20px 
}
.bag .item .price {
	margin: 20px 0;
	padding-left: 20px;
	border-left: 1px solid #10b2ff;
}
.bag .item .price p:nth-of-type(1){
	font-size: 9px;
	color: #6971a3;
}
.bag .item .price p:nth-of-type(2){
	font-size: 18px;
  	font-weight: bold;
}
.bag .item  .btns {
	position: absolute;
	top: 20px;
	right: 20px;
}
.bag .price-total{
	background-color: #f2f2f8;
	padding: 23px 0;
}
.bag .price-total > div {
	max-width: 450px;
	margin: 0 auto;
	overflow: hidden;
}
.bag .price-total > div span {
	float: left;
	font-size: 12px;
	  font-weight: bold;
	  
}
.bag .price-total > div span:nth-of-type(2){
	float: right;
}
.bag .price-total  > div.total span{
	color: #10b2ff;
	font-size: 18px;
  	font-weight: bold;
  	margin-top: 10px;
}
/*
=======================================================================
1:1문의
=======================================================================
*/
.pz-table.type2{
	border-top: 0;
}
.pz-table.type2 th{
	background-color: #f2f2f8;
	border: none;
	border-right: 2px solid #fff;
	text-align: center;
}
.pz-table.type2 th.left{
	text-align: left;
	padding-left: 10px;
}
.pz-table.type2 td {
	font-weight: bold;
	text-align: center;
}
.pz-table.type2 td:nth-of-type(3){
	text-align: left ;
	padding-left: 10px;
}
.qna .tit-area .right button {
	font-size: 20px;
	font-weight: bold;
	height: 40px;
	line-height: 40px;
	padding: 0 20px;
}
.tit-area .add {
	font-size: 12px;
	color: #454a69;
}
.qna .tit-area .add {
	margin-top: 10px;
}
.btm-search {
	max-width: 450px;
	margin: 20px auto;
}
.btm-search .select{
	width: 80px;
}
.btm-search input {
	height: 26px;
}
.btm-search button {
	height: 26px;
	line-height: 26px;
	padding: 0 15px;
	font-size: 12px;
  font-weight: bold;
}
input[type=text].small {
	height: 26px;
	width: 100%;
}
.file-picker {
	width: 100%;
	border: 1px solid #e6e5ec;
	border-radius:4px;
	font-size: 18px;
	font-weight: bold;
	display: inline-block;
	text-align: center;
	padding: 10px 0;
}
.qna-write .felid textarea {
	height: 260px;
	margin: 15px 0;
}
/*
=======================================================================
1:1문의
=======================================================================
*/
.pw-confirm > .conts{
	width: 300px;
	text-align: center;
}
.pw-confirm > .conts .tit {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 80px;
}
.form-type .input-row{
	width: 100%;
}
.pw-confirm button {
	width: 140px;
	height: 40px;
	line-height: 40px;
	padding: 0 ;
	font-size: 20px;
	font-weight: bold;
	margin-top: 40px;
}
.form-type .input-row input {
	width: 100%;
}
.pw-confirm a{
	display: inline-block;
	margin-top: 20px;
	font-size: 12px;
	font-weight: normal;
	color: #454a69;
	border-bottom: 1px solid #454a69;
}
.form-type.narrow{
	width: 220px;
}
.form-type.narrow .input-row {
	margin-bottom: 8px;
}
.form-type.narrow .input-row button {
	width: 100%;
	height: 40px;
	line-height: 40px;
	padding: 0;
	font-size: 20px;
  	font-weight: bold;
}
.form-type.narrow .input-row .select .selected {
	height: 32px;
	line-height: 32px;
	padding: 0 10px ;
}

/*
=======================================================================
ê³ ê°ì„¼í„°
=======================================================================
*/
.center-main > p {
	font-size: 28px;
  font-weight: bold;
  margin: 80px 0 ;
  text-align: center;
}
.center-main ul {
	text-align: center;
}
.center-main ul li a{
	width: 100%;
	height: 100%;
	display: inline-block;
}
.center-main ul li {
	cursor: pointer;
	display: inline-block;
	width: calc( 20% - 29px );
	margin-right: 20px;
	margin-bottom: 40px;
}
.center-main ul li:nth-of-type(5){
	margin-right: 0
}
.center-main ul li  span {
	font-size: 18px;
  	font-weight: bold;
}
.center-main ul li  div {
	width: 100%;
	padding-top: calc( 100% );
	border-radius: 20px;
	background-color: #f2f2f8;
	display: inline-block;
}
.center-main ul li .icon{
	background-position: center;
	background-repeat: no-repeat;
}
.center-main ul li:nth-of-type(1) .icon{
	background-image: url(../img/ct_img01.png);
}
.center-main ul li:nth-of-type(2) .icon{
	background-image: url(../img/ct_img02.png);
}
.center-main ul li:nth-of-type(3) .icon{
	background-image: url(../img/ct_img03.png);
}
.center-main ul li:nth-of-type(4) .icon{
	background-image: url(../img/ct_img04.png);
}
.center-main ul li:nth-of-type(5) .icon{
	background-image: url(../img/ct_img05.png);
}
.center-main ul li:nth-of-type(6) .icon{
	background-image: url(../img/ct_img06.png);
}
.center-main ul li:nth-of-type(7) .icon{
	background-image: url(../img/ct_img07.png);
}
.center-main ul li:nth-of-type(8) .icon{
	background-image: url(../img/ct_img08.png);
}
.center-main ul li:nth-of-type(9) .icon{
	background-image: url(../img/ct_img09.png);
}
.accodian {
	border-bottom: 1px solid #e6e5ec;
}
.accodian .tit{
	font-size: 18px;
	line-height: 60px;
	background: url(../img/acc-off.png) no-repeat right center;
}
.accodian .tit > .sky{
	margin-right: 25px;
} 
.accodian .tit.on{
	font-weight: 900;
	background: url(../img/acc-on.png) no-repeat right center;
}
.accodian .content {
	display: none;
	font-size: 12px;
	color: #454a69;
	padding: 20px 0 20px 35px;
}

.seller .content .row {
	width: 100%;
}
.seller .content .row .item .border {
	border: solid 1px #e6e5ec;
}
.seller .content .row .item{
	padding: 10px;
}
.seller .content .row .item > .title{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 15px;
}
.seller .lnb {
	border-right: 1px solid #e6e5ec;
}
.seller .dual-contents > .content {
	padding-left: 20px;
}
.seller .lnb-item{
	margin-bottom: 30px;
}
.seller .lnb-item > p {
	color: #3c53f4;
	font-size: 12px;
  font-weight: bold;
  margin-bottom: 5px;
}
.seller .lnb-item > ul {
	font-size: 12px;
	font-weight: bold;
	color: #2f3242;
	
}
.seller .lnb-item > ul li {
	margin-bottom: 5px;
	opacity: 0.55;
}
.seller .lnb-item > ul li.on {
	opacity: 1;
	position: relative;
}
.seller .lnb-item > ul li.on::before{
	content: "";
	position: absolute;
	width: 2px;
	height: 100%;
	background: #10b2ff;
	left: -10px;
	top: 0;
}
.seller .tb.box {
	font-size: 12px;
  	font-weight: bold;
	border-radius: 4px;
	background-color: #f2f2f8;
	padding: 5px 10px;
}
.seller .item .border {
	padding: 20px 20px 0 20px ;
	min-height: 288px;
}
.seller .tb.box {
	margin-bottom: 3px;
}
.seller-main .prs-box {
	width: 100%;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	padding: 24px 0;
	border-radius: 4px;
	border: solid 1px #e6e5ec;
	margin-bottom: 10px;
}

.el-row {
	margin-bottom: 10px;
	width: 100%;
}
.el-row::after {
	content: "";
	display: block;
	clear: both;
}
.el-row > div {
	float: left;
	vertical-align: top;
	padding-right: 10px;
}
.el-row > .el-1 {
	width: 10%;
}
.el-row > .el-2 {
	width: 20%;
}
.el-row > .el-3 {
	width: 30%;
}
.el-row > .el-4 {
	width: 40%;
}
.el-row > .el-5 {
	width: 50%;
}
.el-row > .el-6 {
	width: 60%;
}
.el-row > .el-7 {
	width: 70%;
}
.el-row > .el-8 {
	width: 80%;
}
.el-row > .el-9 {
	width: 90%;
}
.el-row > div input[type=text],.el-row > div input[type=number],
.el-row > div input[type=password]{
	width: 100%;
	max-width: 180px;
	height: 24px;
}
.el-row > div input:disabled{
	height: 24px;
	border: 1px solid #e6e5ec;
	border-radius:4px
}
.el-row > div .select {
	width: 100%;
	max-width: 180px;
	width: 100%;
	display: inline-block;
}
.el-row .label label {
	font-size: 12px;
}
.el-row .info-span{
	font-size: 9px;
	font-weight: normal;
	color: #6971a3;
}
.el-row .label input[type=checkbox]{
	
}
.el-row .label{
	font-size: 12px;
	font-weight: bold;
	line-height: 24px;
	padding-right: 0;
	
}
.el-row textarea{
	border: 1px solid #e6e5ec;
	padding: 5px 10px;
	border-radius: 4px;
}
.el-row button{
	height: 24px;
	line-height: 24px;
	padding: 0 10px;
	border-radius: 8px;
	background-color: #f2f2f8;
	color: #10b2ff;
	font-size: 12px;
	font-weight: bold;
	vertical-align: middle;
}

.in-popup .el-row .label {
	text-align: left;
}
.in-popup .el-row .select {
	max-width: none;
}
.in-popup .el-row > div input[type=text],.in-popup .el-row > div input[type=number],
.in-popup .el-row > div input[type=password]{
	width: 100%;
	max-width: none;
	height: 24px;
}



.submit-area button {
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	border-radius: 8px;
	background-color: #3c53f4;
	height: 30px;
	line-height: 30px;
	padding: 0 20px;
	margin-top: 20px;
}
.submit-area button.type2{
	background-color: #f2f2f8;
	color:#10b2ff
}
.el-row span.radio {
	border-radius: 8px;
	font-size: 9px;
	color: #6971a3;
	display: inline-block;
	padding: 0 10px;
	line-height: 20px;
}
.el-row span.radio.on{
	background-color: #f2f2f8;
}
.seller .head-wrap {
	background-color: #fff;
	border-bottom: 1px solid #e6e5ec;
}
.seller header .head-cont {
	padding: 10px 0;
}
.seller  header .head-cont .right ul li a{
	font-size: 12px;
	font-weight: bold;
	color: #3c53f4;
	line-height:80px
}
.seller .content h2.title {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
	margin-top: 20px;
}

.search-fd {
	border: solid 1px #e6e5ec;
	padding: 10px;
}
.btn-tit {
	font-size: 18px;
  font-weight: bold;
}
.btn-tit button {
	font-size: 9px;
  font-weight: normal;
  height: 20px;
  line-height: 20px;
  padding: 0 15px;
  vertical-align: middle;
  border-radius: 5px;
}
.table-grid {
	margin-top: 60px;
}
.btn-tit button.type1{
	background-color: #10b2ff;
	color: #fff;
}
.btn-tit button.type2{
	background-color: #f2f2f8;
	color: #eb5959;
}
.btn-tit button.type3{
	background-color: #f2f2f8;
	color: #6971a3;
}
.seller .calc .tb{
	background-color: #f7f7f7;
	border-radius: 10px;
}
.seller .calc .tb div{
	padding: 20px;
	border-right: 1px solid #e6e5ec;
}
.seller .calc .tb div:last-child{
	border-right: none;
}
.seller .calc .tb p {
	font-size: 18px;
	font-weight: bold;
	
}
.seller .calc .tb p:last-child{
	text-align: right;
	margin-top: 10px;
}
.seller .hash .search-area {
	border: none;
}
.seller .hash .search-area .search-tag {
	border-radius: 16px;
  	border: solid 1px #e6e5ec;
}
.seller .pz-table .clear{
	border: 1px solid #e6e5ec;
	font-size: 12px;
  font-weight: bold;
  color: #3c53f4;
  display: inline-block;
  padding: 5px 10px;
  border-radius: 50px;
}
.el-row .file-img {
	display: inline-block;
	background: #f1f1f1;
	border: 1px solid #9193a2;
	width: 100px;
	height: 100px;
	margin-top: 10px;
}
.el-row input[type=file] + label {
	background-color: #f2f2f8;
	height: 24px;
	line-height: 24px;
	color: #10b2ff;
	font-size: 12px;
	font-weight: bold;
	border-radius: 8px;
	padding: 0 10px;
	display: inline-block;
	vertical-align: bottom;
	margin-bottom: 8px
}
.el-row .list-view {
	color: #454a69;
	font-size: 12px;
	cursor: pointer;
	padding: 10px;
	border: solid 1px #e6e5ec;
	height: 200px;
	overflow-y: auto;
	margin-top: 5px;
}
.board-type .board .re .detail-title{
	margin-top: 20px;
}
.board-type .board .detail-title{
	font-size: 18px;
	line-height: 24px;
	border-bottom: 1px solid #e6e5ec;
	padding: 15px 0;
}
.board-type .board .detail-conts{
	padding: 10px 0;
	font-size: 12px;
}
.board-type .board .imgs {
	margin-top: 30px;
}
.board-type .board{
	padding-bottom: 100px;
}
.board-type .board .detail-title .category {
	height:24px;
	line-height: 24px;
	display: inline-block;
	padding: 0 15px;
	border: 1px solid #e6e5ec;
	border-radius: 50px;
	font-size: 12px;
	color: #10b2ff;
	font-weight: bold;
	margin-right: 10px;
}
.board-type .board .detail-title .status {
	font-size: 12px;
	font-weight: bold;
	line-height: 24px;
	color: #3c53f4;
	margin-left: 10px;
}
.board-type  .other-conts {
	margin-top: 40px;
}
.board-type  .other-conts > div {
	padding: 15px 0 ;
	border-bottom: 1px solid #e6e5ec;
}
.board-type  .other-conts a {
	font-size: 18px;
}
.board-type  .other-conts a .prev, .board-type  .other-conts a .next {
	font-size: 12px;
	font-weight: bold;
	color: #c3c7eb;
	line-height: 24px;
	margin-right: 20px;
}
.board-type  .other-conts a .category {
	height:24px;
	line-height: 24px;
	display: inline-block;
	padding: 0 15px;
	border: 1px solid #e6e5ec;
	border-radius: 50px;
	font-size: 12px;
	color: #10b2ff;
	font-weight: bold;
	margin-right: 10px;
}
.pz-table.type3 td:nth-of-type(2){
	font-weight: bold;
}	
.hamberger{
	width: 24px;
	height: 19px;
	position: relative;
	display: inline-block;
}
.hamberger span{
	position: absolute;
	top: 2px;
	display: inline-block;
	width: 24px;
	height: 2px;
	background: #fff;
	border-radius: 10px;
}
.hamberger::after{
	top: 10px;
	content: "";
	position: absolute;
	width: 24px;
	height: 2px;
	background: #fff;
	border-radius: 10px;
}
.hamberger::before{
	top: 19px;
	content: "";
	position: absolute;
	width: 24px;
	height: 2px;
	background: #fff;
	border-radius: 10px;
}
/*
=======================================================================
팝업
=======================================================================
*/
.layer-popup {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 60;
	background: rgba(0,0,0,0.3);
	
}
.layer-popup.on{
	display: block;
}

.layer-popup .dimmed {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.layer-popup .popup {
	position: absolute;
	left: 50%;
	top: 50%;
	box-sizing: border-box;
	background-color: #fff;
    border: 1px solid #e6e5ec;
	padding: 20px;
	width: 100%;
	max-width: 500px
}


.layer-popup .popup .btn-pop-close {
	position: absolute;
	right: 20px;
	top: 20px;
	color: #eb5959;
	font-size: 9px;
	border-radius: 8px;
	height: 20px;
	line-height: 20px;
	padding: 0 15px;
	background-color: #f2f2f8;
}
.layer-popup .popup .pop-tit {
	font-size: 18px;
	font-weight: bold;
	border-left: 2px solid #3c53f4;  
	padding-left: 20px;
}
.layer-popup .popup .btn-bottom-area {
	margin-top: 40px;
	text-align: right;
}

.layer-popup .popup .pop-conts{
	padding-top: 20px;
}

.layer-popup.alert-type .popup, .layer-popup.confrim-type .popup{
	padding-top:0;
	max-width:420px;
	width: 100%;
}

.layer-popup .pop-bottom-btns {
	text-align: right;
}
.layer-popup .pop-bottom-btns button{
	height: 30px;
	line-height: 30px;
	font-size: 12px;
	  font-weight: bold;
	  padding: 0 15px ;
	  background-color: #10b2ff;
	  color: #fff;
	  border-radius: 8px;
	  margin-left: 5px;
}
.layer-popup .pop-bottom-btns button.type2{
	color: #454a69;
	background-color: #f2f2f8;
}
.pop-conts .pop-list {
	border: solid 1px #e6e5ec;
}
.pop-conts .pop-list li {
	border-top : solid 1px #e6e5ec;
	position: relative;
	padding: 10px 15px;
}
.pop-conts .pop-list li:first-child {
	border-top:none
}
.pop-conts .pop-list li > p{
	font-size: 12px;
	font-weight: bold;
}
.pop-conts .pop-list li > p.small{
	font-weight: normal;
}
.pop-conts .pop-list li > button{
	position: absolute;
	right:15px;
	top: 15px ;
	font-size: 12px;
	font-weight: bold;
	height: 30px;
	line-height: 30px;
	padding: 0 15px;
	border-radius: 8px;
}
.layer-popup .pop-conts .txt {
	font-size: 12px;
  	padding :20px 0 
}
/*
=======================================================================
출판사 로그인
=======================================================================
*/
.seller-login {
	background-color: #2f3242;
	min-height: 100vh;
	padding-top: 25vh;
}
.seller-login .logo {
	text-align: center;

}
.seller-login .wrap-width {
	text-align: center;
	width: 100%;
	max-width: 300px;
	margin: 0 auto;
}
.seller-login .wrap-width .form label {
	color: #fff;
	display: block;
	font-size: 12px;
  font-weight: bold;
  text-align: left;
  margin: 5px 0;
}
.seller-login .wrap-width .form{
	overflow: hidden;
}
.seller-login .wrap-width .form label a {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	border-bottom: 1px solid #fff;
}
.seller-login .wrap-width .sms-confirm {
	height: 32px;
	font-size: 12px;
	font-weight: bold;
	line-height:32px;
}
.seller-login .wrap-width .form input {
	width: 100%;
	height: 38px;
	border-radius: 8px;
  border: solid 1px #e6e5ec;
  padding: 0 10px;
  font-size: 12px;
}
.seller-login .wrap-width .form .select .selected {
	padding: 9px 8px 9px 10px;
	border-radius: 8px;
	text-align: left;
}
.seller-login .wrap-width button {
	width: 100%;
	height: 40px;
	line-height: 40px;
	padding: 0;
	background-color: #3c53f4;
	font-size: 12px;
	border-radius: 8px;
  font-weight: bold;
  margin: 20px 0;
}
.seller-login .wrap-width .redir {
	overflow: hidden;
}
.seller-login .wrap-width .redir a {
	font-size: 12px;
	font-weight: bold;
	color: #10b2ff;
	float:right;
}
.seller-login .wrap-width .redir a:first-child{
	float:left;
	color: #fff;
}
/*
=======================================================================
출판사 회원가입
=======================================================================
*/
.seller-join .title {
	text-align: center;
	font-size: 28px;
	font-weight: bold;
	margin-top: 32px;
}
.seller-join.join01 .conts{
	max-width: 460px;
	margin: 0 auto;
}
.seller-join .progress{
	text-align: center;
	margin: 20px 0;
}
.seller-join .progress .bar{
	position: relative;
	display: inline-block;
	width: 330px;
	height: 12px;
}
.seller-join .progress .bar::after{
	content: "";
	width: 50%;
	position: absolute;
	height: 2px;
	background-color: #e6e5ec;
	top: calc( 50% - 2px );
	left: 0;
}
.seller-join .progress .bar.step2::after{
	background-color:#10b2ff
}
.seller-join .progress .bar.step3::before{
	background-color:#10b2ff
}
.seller-join .progress .bar::before{
	content: "";
	width: 50%;
	position: absolute;
	height: 2px;
	background-color: #e6e5ec;
	top: calc( 50% - 2px );
	right: 0;
}
.seller-join .progress .bar span {
	display: inline-block;
	position: absolute;
	width:10px;
	height:10px;
	border-radius: 50%;
	background-color: #e6e5ec;
	z-index: 9;
}
.seller-join .progress .bar span.on {
	background-color:#3c53f4
}
.seller-join .progress .bar span.pass {
	background-color:#10b2ff
}
.seller-join .progress .bar span:nth-of-type(1){
	left: 0;
}
.seller-join .progress .bar span:nth-of-type(2){
	left: calc( 50% - 5px );
}
.seller-join .progress .bar span:nth-of-type(3){
	right: 0;
}
.seller-join .progress .pg-cont {
	position: relative;
	width: 370px;
	height:  60px;
	margin :0 auto
}
.seller-join .progress .pg-cont p {
	font-size: 12px;
	  font-weight: bold;
	  position: absolute;
}
.seller-join .progress .pg-cont p:nth-of-type(1){
	left: 3px;
}
.seller-join .progress .pg-cont p:nth-of-type(2){
	left: calc( 50% - 38px );
}
.seller-join .progress .pg-cont p:nth-of-type(3){
	right: -7px;
}
.seller-join .agreement {
	border: solid 1px #e6e5ec;
	padding : 25px
}
.seller-join .agreement a {
		font-size: 12px;
	  font-weight: bold;
	  border-bottom: 1px solid #454a69;
}
.seller-join .agreement .item {
	display: table;
	width: 100%;
	margin-bottom: 15px;
}
.seller-join .agreement .item:last-child{
	margin-bottom: 0;
}
.seller-join .agreement .item >div {
	display: table-cell;
	width: 50%;
}
.seller-join .agreement .item >div:last-child{
	text-align: right;
}
.seller-join .all-agree{
	text-align: right;
	font-size: 12px;
	font-weight: bold;
	margin: 20px 25px 30px 0;
}
.seller-join .next{
	text-align: right;
	margin-top: 40px;
}
.seller-join .next button {
	height: 30px;
	line-height: 30px;
	padding: 0 15px ;
	font-size: 12px;
	font-weight: bold;
	border-radius: 8px;
}
.seller-join .el-row{
	margin-bottom: 0;
}
.seller-join .el-row > div {
	padding: 5px 10px;
}
.seller-join .form-type {
	border: solid 1px #f2f2f8;
}
.seller-join .el-row .label {
	background: #f2f1f7;
	border: 1px solid #f2f1f7;
	display: inline-block;
	min-height: 36px;
}
.seller-join .el-row input[type=file] + label{
	margin-bottom: 0;
}
.seller-join .form-type span.add{
	font-size: 9px;
	color: #2f3242;
}
.seller-join .form-type .reqired {
	color: #10b2ff;
} 
.seller-join .form-type textarea {
	height: 150px;
}
.seller-join  .tit a {
	color: #6971a3;
	font-size: 9px;
	font-weight: bold;
	border-bottom: 1px solid #6971a3;
}
.seller-join input {
	font-size: 12px;
}
.seller-join  .tit .add {
	font-size: 9px;
	font-weight: bold;
	color: #6971a3;
	display: inline-block;
	margin: 0 20px;
}
.seller-join  .tit {
	font-size: 18px;
	font-weight: bold;
	margin: 20px 0;
}
.seller-join .el-row > div.no-pad {
	padding: 0;
}
.seller-join .book-tab > ul li.on {
	background-color: #e6e5ec;
	opacity: 1;
}
.seller-join .book-tab > ul li {
font-size: 12px;
  font-weight: bold;
  color: #2f3242;
  opacity: 0.35;
  padding: 15px 14px;
}
.seller-join .book-tab .btns{
	padding: 10px ;
}
.seller-join .book-tab .btns button:last-child{
	font-size: 9px;
	font-weight: normal;
	color: #eb5959;
	background-color: #f2f2f8;
	margin-top: 10px;
}
.seller-join .book-tab .btns button {
	width: 100%;
	border-radius: 8px;
	height: 30px;
	line-height: 30px;
	padding: 0;
	font-size: 12px;
	font-weight: bold;
}
.seller-join .el-row .file-img {
	height: 120px;
	vertical-align: bottom;
	margin-right: 5px;
}
.seller-join .input-plus .input-it{
	margin-bottom: 5px;
	position: relative;
}
.seller-join .input-plus .input-it:last-child{
	padding-right:25px;
	
}
.seller-join .input-plus .input-it:first-child {
	padding-right:25px;
}
.seller-join .input-plus .input-it .action-btn{
	cursor: pointer;
	display: inline-block;
	width:24px;
	font-size: 15px;
	font-weight: 200;
	height: 24px;
	line-height: 24px;
	text-align: center;
	position: absolute;
	right: 0;
	top: 1px;
	background-color:#e6e5ec ;
	color: #eb5959;
}
.seller-join .input-plus .input-it .action-btn.plus{
	display: inline-block;
	width:24px;
	font-size: 15px;
	font-weight: 200;
	height: 24px;
	line-height: 24px;
	text-align: center;
	position: absolute;
	right: 0;
	top: 1px;
	background-color:#10b2ff ;
	color: #fff;
}
.seller-join .el-row {
	position: relative;
}
.seller-join .el-row > div{
	margin-left: 157px;
}
.seller-join .el-row > div.label{
	margin-left: 0;
	position:absolute;
	bottom:0;
	top:0;
}
.seller-join .el-row > div.no-pad {
	margin-left: 0;
}
/*
=======================================================================
랜딩
=======================================================================
*/

.landing-header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.landing-header .head-wrap {
	background: none;
}
.landing .main-bg {
	padding: 10% 0 40% 0;
	text-align: right;
	background: url(../img/bg-landing.png) no-repeat center / cover;
	color: #fff;
}
.landing .main-bg .big {
	font-size: 36px;
  font-weight: bold;
  margin-bottom: 5px;
}

.landing .main-bg .mid {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}

.landing .main-bg .small {
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 20px;
}

.landing .main-bg .search{
	background-color: #fff;
	width: 274px;
	height: 32px;
	border-radius: 60px;
	display: inline-block;
	margin-top: 4px;
	margin-bottom: 20px;
}
.landing .main-bg .search input{
	width: 100%;
	border: none;
	background-color: none;
	border-radius: 60px;
	padding-left: 40px;
	display: inline-block;
	height: 32px;
	background: url(../img/icon_sh.png) no-repeat 5% center;
	font-size: 12px;
}
.landing .main-bg button {
	width: 102px;
	  height: 40px;
	  border-radius: 20px;
	  background-color: #3c53f4;
	  font-size: 12px;
	  font-weight: bold;
	  padding: 0;
}
.landing .recomend-index .row{
	width: 100%;
}
.landing .recomend-index .row > div {
	width: 50%;
	float: left;
	padding: 0 40px ;
}
.main.landing .recomend-index .row .tb > div:first-child{
	padding: 0;
	background: none;
	display: inline-block;
	min-height: 200px;
}
.main.landing  .edition {
	background:#3c53f4
}
.main.landing  .edition .conts .item.it01 {
	background: url(../img/img-ld01.png) no-repeat left center ;
}
.main.landing  .edition .conts .item.it02 {
	background: url(../img/img-ld02.png) no-repeat left center ;
}
.main.landing  .edition .conts .item.it03 {
	background: url(../img/img-ld03.png) no-repeat left center ;
}
.main.landing  .edition .conts .item.it04 {
	background: url(../img/img-ld04.png) no-repeat left center ;
}
.main.landing .swiper-container-horizontal>.swiper-pagination-progressbar{
	background:rgba(255, 255, 255, 0.4);
	top:auto;
	bottom: 0;
	height: 2px;
}
.main.landing .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
	background-color: #fff;
	height: 4px;
	top: -1px;
}
.main.landing  .recomend-index .slider-area .swiper-container {
	padding-bottom: 20px;
}
.main.landing  .recomend-index .slider-area {
	margin-top: -60px;
}
.main.landing  .recomend-index .cmt {
	color: #e5e7f8;
	font-size: 16px;
	font-weight: bold;
	padding-top: 10px;
}
.main.landing  .recomend-index .cmt p{
	display: block;
	font-size: 56px;
	font-weight: bold;
	font-style: italic;
	color: #cadcc5;
}
.main.landing h3 > p{
	font-size: 22px;
}
.main.landing h3{
	font-size: 36px;
	font-weight: bold;
}
.main.landing .cmt-area {
	text-align: center;
}
.main.landing .cmt-area .intro{
	font-size: 15px;
	color: #2f3242;
	padding: 60px 0;
}
.main.landing .cmt-area  .tb > div .big{
	font-size: 28px;
	font-weight: bold;
	color: #2f3242;
}
.main.landing .cmt-area  .tb > div {
	padding-top: 110px;
	background: url(../img/img-ld05.png) no-repeat center top ;
}
.main.landing .cmt-area  .tb > div:nth-of-type(2){
	background: url(../img/img-ld06.png)no-repeat center top ;
}
.main.landing .cmt-area  .tb > div:nth-of-type(3){
	background: url(../img/img-ld07.png)no-repeat center top ;
}
.main.landing .cmt-area  .tb > div .mid{
	font-size: 18px;
	font-weight: bold;
	color: #2f3242;
	margin: 25px 0 20px 0;
}
.main.landing .cmt-area  .tb > div .small{
	font-size: 12px;
	font-weight: normal;
	color: #454a69;
}
.main.landing .edition .big{
	font-size: 18px;
	font-weight: bold;
}
.main.landing .edition .small{
	font-size: 12px;
	font-weight: normal;
}
.main.landing .review-area .conts{
	max-width: 700px;
}
.main.landing .review-area{
	background: url(../img/bg-imgsp.png) no-repeat center / cover;
	padding: 100px 0;
}
.main.landing .review-area .user {
	text-align: right;
	font-size: 12px;
	font-weight: bold;
	color: #3c53f4;
	margin-top: 10px;
	margin-right: 20px;
}
.main.landing .review-area h3 {
	margin:0;
	padding:20px 0
}
.main.landing .review-area .user.right{
	margin-right: 0;
	margin-left: 20px;
	text-align: left;
}
.main.landing .review-area .speech-bubble{
	padding: 20px;
	color: #fff;
}
.speech-bubble {
	position: relative;
	background: #3c53f4;
	border-radius: 20px;
}

.speech-bubble:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 10%;
	width: 0;
	height: 0;
	border: 16px solid transparent;
	border-top-color: #3c53f4;
	border-bottom: 0;
	border-left: 0;
	margin-left: -8px;
	margin-bottom: -16px;
}

.speech-bubble.right:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 90%;
	width: 0;
	height: 0;
	border: 16px solid transparent;
	border-top-color: #3c53f4;
	border-bottom: 0;
	border-right: 0;
	margin-left: -8px;
	margin-bottom: -16px;
}
.main.landing .interview .nrw {
	width: 540px;
	padding: 80px 0;
}
.main.landing .interview .nrw h3 span {
	background: url(../img/bg-ld02.png) no-repeat center bottom / contain;
	padding:0 15px 20px 15px;
	display: inline-block;
}

.main.landing .edition .tb > div {
	padding: 20px 20px 20px 140px;
}
.main.landing .interview .blue {
	font-size: 14px;
}
.main.landing .interview .blue span{
	font-weight: 900;
}
.main.landing .interview .wid-conts{
	padding: 100px 0;
	text-align: center;
	background: url(../img/bg-ld01.png) no-repeat center / cover;
	color: #fff;
}
.main.landing .interview .wid-conts button {
	background: #0018be;
	margin-top: 30px;
}
.main.landing .interview .wid-conts button:nth-of-type(1){
	margin-right: 10px;
}
.main.landing .interview .wid-conts p:nth-of-type(1){
	font-size: 28px;
  font-weight: bold;
  margin-bottom: 10px;
}
.landing2 .part01 {
	background: url(../img/part01.png) no-repeat center / cover;
	height:77vw;
	max-height: 1478px;
}
.landing2 .part.part02 {
	background: url(../img/part02.png) no-repeat center / cover;
	height:37vw;
	max-height: 724px;
	padding-top:min( 380px, 19%);
	position: relative;
    margin-top: -200px;
}
.landing2 .part.part03 {
	background: url(../img/part03.png) no-repeat center / cover;
	height:77vw;
	max-height: 1478px;
	margin-top: -45px;
}
.landing2 .part.part04 {
	background: url(../img/part04.png) no-repeat center / cover;
	height:52vw;
	max-height: 998px;
	position: relative;
	margin-top: -109px;
}
.landing2 .part.part05 {
	background: url(../img/part05.png) no-repeat center / cover;
	height:78vw;
	max-height: 1497px;
	margin-top: -50px;
}
.landing2 .part06 {
	background: url(../img/part06.png) no-repeat center / cover;
	height:54vw;
	max-height: 1036px;
}
.landing2 .part07 {
	background: url(../img/part07.png) no-repeat center / cover;
	height:87vw;
	max-height: 1670px;
	padding-top: min( 800px, 40%)
}
.landing2 .part.part08 {
	background: url(../img/part08.png) no-repeat center / cover;
	height:60vw;
	position: relative;
	margin-top: -100px;
}

.landing2 .part02 .box{
	border-radius: 20px;
	border: solid 2px #c3c7eb;
	background-color: #fff;
	font-size: 10px;
	max-width: 300px;
	margin: 0 auto;
	padding: 20px;
	text-align: center;
}
.landing2 .part {
	max-width: 1920px;
	margin: 0 auto;
}
.landing2 .part02 .box .tb div {
	font-size: 9px;
	text-align: left;
	vertical-align: middle;
}
.landing2 .part02 .box .tb div button{
	border-radius: 8px;
	padding: 0;
	height: 40px;
	font-size: 11px;
	line-height: 40px;
	width: 100%;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3);
	background-image: linear-gradient(to bottom, #1831cb, #3951f1);
	background-image: linear-gradient(to bottom, #1831cb, #3951f1);
}
.landing2 .part02 .box .tb div button a {
	font-size: 11px;
	color:#fff
}
.landing2 .part07 .box{
	max-width: 470px;
	margin: 0 auto;
	color: #fff;
	font-size: 16px;
  	font-weight: 500;
}
.landing2 .part07 .box div {
	vertical-align: middle;
}
.landing2 .part07 .box button {
	border-radius: 12px;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
	background-image: linear-gradient(to bottom, #f1fafe, #cce3ff);
	font-weight: 500;
	font-size: 16px;
	height: 64px;
	line-height: 64px;
	width: 100%;
	padding: 0;
	color: #333;
}
.landing2 .part08 .box {
	max-width: 460px;
	margin: 0 auto;
	width: 100%;
	border-radius: 20px;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2);
	background-color: #fff;
	position: absolute;
    top: -200px;
	left: calc( 50% - 230px );
}
.landing2 .part08 .box form > div{
	padding:60px;
	padding-top:130px !important;
	background: url(../img/icon-ld.png) no-repeat center 30px ;
}
.landing2 .part08 .box label{
	font-size: 14px;
	float: left;
	font-weight: 600;
	width: 100px;
	line-height: 40px;
	display: inline-block;
}
.landing2 .part08 .box .item{
	margin-bottom: 10px;
	overflow: hidden;
}
.landing2 .part08 .box .tit {
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 30px;
	
}
.landing2 .part08 .box .tit span {
	background: linear-gradient(to top, #bee2ff 50%, transparent 50% );
}
.landing2 .part08 .box input{
	float: left;
	height: 40px;
	border-radius: 10px;
	background-color: #efeeef;
	width: calc( 100% - 120px );
}
.landing2 .part08 .box button{
	width: 100%;
	border-radius: 0 0 20px 20px;
	padding: 14px 0;
	font-size: 20px;
	  font-weight: 500;
	  letter-spacing: 10px;
}
.seller-login.join {
	padding-top: 10vh;
}
.tab .tab-item > div{
	display: none
}
.tab .tab-item > div.on{
	display: block
}

@media (min-width: 1400px) {
	.landing2 .part.part08 {
		height:35vw;
	}
	.landing2 .part02 .box{
		padding: 30px;
		max-width: 400px;
		font-size: 14px;
	}
	.landing2 .part02 .box .tb div{
		font-size: 12px;
	}
	.landing2 .part07 .box div{
		font-size: 20px;
	}
	.landing2 .part07 .box{
		max-width: 600px;
	}
	.landing2 .part07{
		height: 77vw;
	}
	.landing2 .part08 .box{
		max-width: 600px;
		left: calc( 50% - 300px );
	}
}

@media (max-width: 1024px) {

	.landing2 .part08 .box form > div{
		padding:40px
	}
}

@media (max-width: 768px) {
	.landing2 .part.part01{
		background: url(../img/part01_m.png) no-repeat center / cover;
		height: auto;
		width: 100%;
		max-height: 0;
		padding-top : calc( 100%*1.8 )
	}
	.landing2 .part.part02{
		margin-top: -6%;
		background: url(../img/part02_m.png) no-repeat center / cover;
		height: auto;
		width: 100%;
		max-height: 0;
		padding-top : calc( 100%*0.9 );
		padding-bottom : calc( 100%*0.6 )
	}
	.landing2 .part.part03{
		background: url(../img/part03_m.png) no-repeat center / cover;
		height: auto;
		max-height: 0;
		padding-top : calc( 100%*2.7 );
		margin-top: -8%;
	}
	.landing2 .part.part04{
		background: url(../img/part04_m.png) no-repeat center / cover;
		height: auto;
		max-height: 0;
		padding-top : calc( 100%*2.1 );
		margin-top: -5%;
	}
	.landing2 .part.part05{
		background: url(../img/part05_m.png) no-repeat center / cover;
		height: auto;
		max-height: 0;
		padding-top : calc( 100%*2.4 );
		margin-top: -10%;
	}
	.landing2 .part.part06{
		background: url(../img/part06_m.png) no-repeat center / cover;
		height: auto;
		max-height: 0;
		padding-top : calc( 100%*1.3 )
	}
	.landing2 .part.part07{
		background: url(../img/part07_m.png) no-repeat center / cover;
		height: auto;
		max-height: 0;
		width: 100%;
		max-height: 0;
		padding-top : calc( 100%*1.6 );
		padding-bottom : calc( 100%*1.0 )
	}
	.landing2 .part07 .box{
		padding: 20px;
	}
	.landing2 .part07 .box div{
		display: block;
	}
	.landing2 .part.part08{
		background: url(../img/part08_m.png) no-repeat center / cover;
		height: auto;
		max-height: 0;
		padding-top : calc( 100%*0.7 );
		margin-top:-10%;
		/* margin-bottom:180px; */
		padding-bottom:150px;
	}

	.landing2 .part08 .box .tit{
		font-size: 22px;
	}
	.landing2 .part08 .box > div{
		padding: 30px;
	}
	.landing2 .part08 .box input{
		width: calc( 100% - 100px )
	}

	.landing2 .part07 .box div:first-child{
		margin-bottom: 10px;
	}
	.footer  {
		background-color: #f0f0f0;
		color: #454a69;
	}
	.footer .footer-conts{
		padding: 15px;
	}
	.footer .footer-conts > div{
		display: block;
	}
	.footer a{
		color: #454a69;
		font-size: 12px;
		line-height: 30px;
	}
	.footer .footer-conts .tb > li{
		display: inline-block;
		margin-right: 10px;
	}
	.footer .footer-conts .tb{
		display: block;
		text-align: left;
		padding-bottom: 15px;
		border-bottom: 1px solid #d8d8d8 ;
		margin-bottom: 30px;
	}
	.footer .footer-conts >div.pc{
		display: none;
	} 
	.footer .footer-conts .mb{
		display: inline-block;
		position: absolute;
		right: 20px;
		bottom: 15px;
		padding-right: 15px;
	}
	.footer .footer-conts .mb::after{
		position: absolute;
		content: "";
		width: 10px;
		height: 5px;
		right: 0;
		top: 4px;
		background: url(../img/acc-on.png) no-repeat center / contain;
	}

	
}

@media (max-width: 500px) {
	.landing2 .part.part08{
		padding-top: calc( 100%*1.5 );
	}
	.landing2 .part07 .box{
		max-width: 400px;
	}
	.landing2 .part08 .box{
		top: -20%;
	}
	.landing2 .part08 .box{
		width: 90%;
		left: 5%;
	}
	
}


/* @media (max-width: 770px) {
    header .head-cont{
        padding: 15px 20px;
    }
	header .head-cont a {
        display: none;
    }
    header .head-cont .left > div.logo img{
        width: 83px;
	}
	header .head-cont .left .search{
		width: 200px;
		margin-top:0
	}
	header .head-cont .left .search input{
		padding-left:15px;
		padding-right: 40px;
		background: url(../img/icon_sh.png) no-repeat 95% center;
	}
	header .gnb{
		display: none;
	}
	.main .main-hash .conts span.tit{
		display: none;
	}
	.main .main-hash{
		background-color:#fff;
		width: 100%;
		overflow: hidden;
	}
	.main .main-hash .conts{
		white-space: nowrap;
	}
	.main .main-hash .conts span {
		border-radius: 15px;
		border: solid 1px #3c53f4;
		background: #fff;
		font-size: 12px;
		padding:2px 12px;
		color:#3c53f4;
		font-weight: normal;
	}
	.main .edition{
		display: none;
	}
} */