/* 메인페이지 */
#main{width:100%;height:calc(100vh - 315px);background:#eefbff;}
#main .main-bn{height:100%;}
#main .main-bn .bn-wrap{height:100%;}
/* #main .main-sc{width:1230px;height:120px;margin:0 auto;}
#main .main-sc ul{display:flex;height:100%;}
#main .main-sc ul li{flex:1;height:100%;} */

/* 인쇄주문하기 : gnb 1~4 */
#order-masta .masta-sc .cnt-wrap{width:100%;margin:0 auto;transition:all .2s;}
#order-masta .masta-sc .cnt-wrap .tx-wrap.tp1{margin-top:30px;}

/* 교정보기 */
#ftp-revision .revision-sc .tx-wrap.tp1{margin-top:30px;}
#ftp-revision .revision-sc .table-wrap::after{content:'';display:block;clear:both;}
#ftp-revision .revision-sc .table.tp2{margin-top:10px;}
#ftp-revision .revision-sc .table.tp3{margin-top:50px;}
#ftp-revision .revision-sc .btn-mid{float:right;margin-top:30px;transition:all .2s;}
#ftp-revision .revision-sc .btn-mid:hover{color:#fff;background:#0eb3d3;}
#ftp-revision .revision-sc .btn-wrap{display:table;width:fit-content;margin:50px auto 0;}
#ftp-revision .revision-sc .btn-wrap button{display:inline-block;margin:0 0 0 10px;}
#ftp-revision .revision-sc .btn-wrap button:first-child{margin-left:0;}
#ftp-revision .revision-sc .btn-wrap button span{background:none;}

/* 디자인의뢰 */
#design .design-sc .tx-tit span{font-weight:400;color:#777;}
#design .design-sc .ico-wrap{display:flex;justify-content:space-between;}
#design .design-sc .ico-wrap li{flex:1;position:relative;font-size:17px;text-align:center;color:#555;}
#design .design-sc .ico-wrap li::before{content: '';display:block;width:150px;height:150px;border:2px solid #0eb3d3;border-radius:100%;background:#fff;background-repeat:no-repeat !important;background-position:center !important;box-sizing:border-box;margin:0 auto 27px;transition:all .2s;}
#design .design-sc .ico-wrap li::after{content:'';position:absolute;top:-10px;left:50%;transform:translateX(-50%);display:block;width:170px;height:170px;border-radius:100%;background:rgba(14,179,211,0.1);z-index:-1;transition:all .2s;}
#design .design-sc .ico-wrap li:nth-child(2n)::before{border:2px solid #43c39f;}
#design .design-sc .ico-wrap li:nth-child(2n)::after{background:rgba(82,208,173,0.1)}
#design .design-sc .ico-wrap li.ico-01::before{background-image:url(/images/ico-design-book.png);}
#design .design-sc .ico-wrap li.ico-02::before{background-image:url(/images/ico-design-brochure.png);}
#design .design-sc .ico-wrap li.ico-03::before{background-image:url(/images/ico-design-leaflet.png);}
#design .design-sc .ico-wrap li.ico-04::before{background-image:url(/images/ico-design-invite.png);}
#design .design-sc .ico-wrap li.ico-05::before{background-image:url(/images/ico-design-ad.png);}
#design .design-sc .cnt-box{margin-top:60px;}
#design .design-sc .cnt-box .img-wrap{display:inline-block;width:50%;vertical-align:middle;border-radius:10px;overflow:hidden;}
#design .design-sc .cnt-box .img-wrap img{width:100%;}
#design .design-sc .cnt-box .tx-wrap{display:inline-block;width:49%;vertical-align:middle;padding-left:50px;}
#design .design-sc .cnt-box .tx-wrap .tx-tit{font-size:30px;font-weight:500;letter-spacing:-.5px;color:#333;}
#design .design-sc .cnt-box .tx-wrap .tx-sub{font-size:17px;line-height:1.6;color:#777;word-break:keep-all;margin-top:20px;}
#design .design-sc .cnt-box .tx-wrap .tx-list{margin-top:20px;}
#design .design-sc .cnt-box .tx-wrap .tx-list li{font-size:15px;letter-spacing:-.5px;line-height:1.4;color:#777;margin-top:10px;}
#design .design-sc .cnt-box .tx-wrap .tx-list li::before{content:'';display:inline-block;width:3px;height:3px;vertical-align:middle;background:#8d929d;margin:-2px 8px 0 0;}
#design .design-sc .cnt-box .tx-wrap .tx-list li em{display:inline-block;width:160px;color:#222;vertical-align:top;}
#design .design-sc .cnt-box .tx-wrap .tx-list li span{display:inline-block;width:calc(100% - 180px);vertical-align:top;word-break:keep-all;}
#design .design-apply .tx-wrap{background:#fff;}

/* 로그인 */
#login{width:100%;height:calc(100vh - 315px);background:#eefbff;}
#login .inner{display:table;width:400px;height:90%;}
#login .login-wrap{display:table-cell;vertical-align:middle;}
#login .login-wrap .tx-tit{color:#0f91d0;margin-bottom:45px;}
#login .login-wrap input[type="radio"]{margin-left:10px;}
#login .login-wrap input[type="text"]{height:45px;padding:0 10px;margin-top:15px;}
#login .login-wrap input[type="password"]{margin-top:15px;}
#login .login-wrap .btn-big{width:100%;margin-top:15px;}
#login .login-wrap .btn-big::after{width:100%;}
#login .login-wrap .btn-wrap::after{content:'';display:block;clear:both;}
#login .login-wrap .btn-wrap li{float:left;margin-top:15px;}
#login .login-wrap .btn-wrap li:last-child{float:right;}
#login .login-wrap .btn-wrap li .btn-tx{color:#0f91d0;}
#login .login-wrap .pw-wrap{display:none;}

/* 회원가입 */
#join{background:#eefbff;}
#join .tx-tit{color:#1191d0;margin-bottom:45px;}
#join .join-wrap{width:700px;border-radius:12px;background:#fff;padding:30px;box-sizing:border-box;margin:0 auto;}
#join .join-wrap .tx-sub{font-size:22px;font-weight:500;line-height:1.2;word-break:keep-all;}
#join .join-wrap .chk-wrap li{margin-top:30px;}
#join .join-wrap .chk-wrap li .tit{font-size:14px;color:#333;margin-bottom:8px;}
#join .join-wrap .chk-wrap li .tit::after{content:'';display:block;clear:both;}
#join .join-wrap .chk-wrap li .tit p{float:left;}
#join .join-wrap .chk-wrap li .tit .chk-box{float:right;}
#join .join-wrap .chk-wrap li .tit .chk-box input[type="checkbox"]{margin-bottom:1px;}
#join .join-wrap .btn-big span{text-align:center;}
#join .join-wrap iframe{width:100%;height:200px;border-radius:5px;}
#join .table-wrap input[type="password"]{height:30px;}

/* 마이페이지 */
#mypage input[type="password"]{height:30px;}
#mypage .tx-wrap{line-height:1.4;margin-top:30px;}


/* 1290px */
@media screen and (max-width:1290px){
  #main{height:calc(100vh - 300px);}
  #login{height:calc(100vh - 300px);}
}


/* 1230px */
@media screen and (max-width:1230px){
  #main .main-sc{width:100%;}
}


/* 980px */
@media all and (max-width:980px) {
  #main{height:calc(100vh - 260px);}

  #design .design-sc .cnt-box{margin-top:50px;}
  #design .design-sc .cnt-box .img-wrap{display:block;width:100%;}
  #design .design-sc .cnt-box .tx-wrap{display:block;width:100%;padding-left:0;margin-top:30px;}
  #design .design-sc .cnt-box .tx-wrap .tx-tit{font-size:22px;}
  #design .design-sc .cnt-box .tx-wrap .tx-sub{font-size:15px;margin-top:15px;}
  #design .design-sc .cnt-box .tx-wrap .tx-list{margin-top:10px;}
  #design .design-sc .cnt-box .tx-wrap .tx-list li::before{margin-top:10px;}
  #design .design-sc .cnt-box .tx-wrap .tx-list li em{width:calc(100% - 11px);}
  #design .design-sc .cnt-box .tx-wrap .tx-list li span{display:block;width:100%;padding-left:11px;}
  #design .design-sc .ico-wrap li{font-size:15px;}
  #design .design-sc .ico-wrap li::before{width:120px;height:120px;}
  #design .design-sc .ico-wrap li::after{width:140px;height:140px;}

  #login{height:calc(100vh - 260px);}
}


/* 780px */
@media all and (max-width:780px) {
  #order-masta .masta-sc .cnt-wrap{width:100%;}

  #join .join-wrap{width:100%;}
}


/* 680px */
@media all and (max-width:680px) { 
  #main{height:auto;padding:13.5vh 0;}
  #main .main-bn{height:auto;}
  #main .main-bn .bn-wrap{height:auto;}
  #main .main-sc{width:100%;height:auto;background:#fff;padding:50px 0;}
  #main .main-sc ul{display:block;width:calc(100% - 60px);height:auto;margin:0 auto;}
  #main .main-sc ul li{height:120px;margin-top:30px;}
  #main .main-sc ul li.bg-white{border:1px solid #e6e7e9;}
  #main .main-sc ul li:first-child{margin-top:0;}

  #design .design-sc .cnt-box{margin-top:40px;}
  #design .design-sc .ico-wrap{display:block;}
  #design .design-sc .ico-wrap::after{content:'';display:block;clear:both;}
  #design .design-sc .ico-wrap li{float:left;}
  #design .design-sc .ico-wrap li:nth-child(-n+5){width:50%;margin-bottom:40px;}
  #design .design-sc .ico-wrap li:nth-child(5n){width:100%;margin-bottom:0;}
  #design .design-sc .ico-wrap li::before{width:100px;height:100px;}
  #design .design-sc .ico-wrap li::after{width:120px;height:120px;}

  #login .inner{width:100%;}
  #login .login-wrap{top:-30px;}
  #login .login-wrap .tx-tit{margin-bottom:30px;}
 
  #join .tx-tit{margin-bottom:30px;}
  #join .join-wrap .tx-sub{text-align:center;}
}