@charset "utf-8";
/* CSS Document */


@media only screen and (max-width:1240px) {
.menu-bt-wrapper{display:block}
.gnb{display:none}
.pfixed{height:70px !important}
#header{z-index:99;background:#fff;}
.head{padding:5px}
.head .top-bt{display:none}
.mgnb .top-bt{right:180px;top:25px}
.spd{padding-top:0}
.pfixed #logo img{width:100%}
.foot-copy, .foot-block{padding-left:20px;padding-right:20px}
#logo{float:none;position:absolute;margin:15px;width:160px}
.pfixed #logo{padding:0;width:160px;margin-top:3px}
.search-box{float:none;width:calc(100% - 300px);max-width:300px;margin:10px auto}
.pro-block{padding:0 30px}
}

@media only screen and (max-width:1100px) {
.foot-bt{margin-left:0;width:auto}
.top-bt{display:none}
}

@media only screen and (max-width:1000px) {
body{font-size:12px}
.sub-container{padding-left:10px;padding-right:10px;padding-bottom:0}
.block{padding-left:0;padding-right:0}
.top-bnr{display:none}
.menu-bt-wrapper{top:15px}
.main-bnr{margin:5px auto;padding:0 5px}
.main-bnr p{font-size:12px}
.pic_lt ul{margin-left:-20px}
.pic_lt li{padding:10px 0 20px 20px}
.main-left{width:calc(60% - 40px)}
}

@media only screen and (max-width:860px) {
.main-bnr li a{padding:5px 0}
.main-bnr li:nth-child(1) a{padding-left:10px;padding-right:20px}
.main-bnr li:nth-child(4) a{padding-left:5px;padding-right:20px}
}

@media only screen and (max-width:800px) {
.main-copy{margin-top:170px}
.foot-contact{float:left}
.family-area{max-width:400px}
table.default-tb td{word-break:keep-all}
.sub-menu li{border-left:none}
#bo_cate #bo_cate_on{border-bottom:1px solid #ddd}
#footer, .family p{font-size:12px}
.pro-title span:before{width:4px;height:4px;margin-left:-2px;top:-10px}
.pro-area{padding-top:30px}
.p-img li img{height:calc(100% - 30px);width:calc(100% - 10px);left:5px}
.p-img li{padding-bottom:20%}
.p-img li p{padding:5px 0}
.foot_layerpopup01{width:96%;margin-left:-48%}
.main-bnr li img{width:35px}
.main-bnr li a p{left:inherit}
}

@media only screen and (max-width:768px) {
.pro1-bg .col-lg-6, .pro1-bg .col-sm-6, .pro2-bg .col-lg-6, .pro2-bg .col-sm-6, .pro3-bg .col-lg-6, .pro3-bg .col-sm-6, .pro4-bg .col-lg-6, .pro4-bg .col-sm-6, .pro5-bg .col-lg-6, .pro5-bg .col-sm-6, .pro6-bg .col-lg-6, .pro6-bg .col-sm-6, .pro7-bg .col-lg-6, .pro7-bg .col-sm-6, .pro8-bg .col-lg-6, .pro8-bg .col-sm-6, .pro9-bg .col-lg-6, .pro9-bg .col-sm-6, .pro10-bg .col-lg-6, .pro10-bg .col-sm-6
{min-height:0}
.foot-block{padding-right:0}
h1.gr-title{font-size:1.5em}
.menu-bt-wrapper{right:10px}
#logo{margin:17px 5px;width:120px}
.pfixed #logo{width:120px;margin-top:8px}
h2.sub-title{font-size:2em;margin-bottom:10%;font-weight:400}
.sub1, .sub2, .sub3, .sub4, .sub5, .sub6, .sub7{height:50px}
.main-left, .main-right{width:100%;float:none}
.main-right iframe{height:300px}
.pro-back{margin:40px auto 20px}
.foot-logo{float:none}
.foot-copy{padding-top:0}
.addr{margin-left:0;margin-top:10px;float:none}
.main-bnr li a{padding:5px 0}
}

@media only screen and (max-width:710px) {
.main-bnr li img{display:none}
.main-bnr li:nth-child(2) p{padding-left:0}
.main-bnr li a p{width:100%;text-align:center;position:absolute;left:0;top:50%}
.main-bnr li a{height:40px}
.main-bnr li:nth-child(1) a, .main-bnr li:nth-child(4) a{padding-left:0}
}

@media only screen and (max-width:680px) {
.bg-bt li{font-size:12px}
.sub-top, .sub-top2{font-size:0.7em;margin-bottom:20px;margin-top:30px}
.s-txt{font-size:1.1em}
.sub-txt{margin-top:10px}
.copy-start{width:15px;top:15px}
.int-img{margin-top:-10px}
}

@media only screen and (max-width:640px) {
.main-bnr li a p{font-size:12px}

}											

@media only screen and (max-width:580px) {
.main-bnr li img{display:none}
.main-bnr li a{height:40px}
.main-bnr li a p{left:0;width:100%;text-align:center}
.bg-bt{text-align:center}
.bg-bt li{display:inline-block;width:20px;float:none;border-right:1px solid #ccc;border-radius:20px;text-indent:-9999px;padding:8px 0}
.bg-bt li:before{display:block;content:attr(num);text-indent:0;position:absolute;top:8px;width:100%;left:0}
.bg-bt .on{width:100px;text-indent:0;padding:13px 0}
.bg-bt li.on:before{display:none}
.pg_page, .pg_current{min-width:15px;padding:0 2px;height:15px;line-height:12px;font-size:10px}
.pg_current{line-height:13px}
}

@media only screen and (max-width:480px) {
.mainblock, .main-right{margin-top:20px}
#logo{float:left;position:relative}
.search-box{float:left;margin:10px 0 0 10px;width:calc(100% - 200px);}
.navi>div>div{width:95%}
.home-bt{padding:10px 0 10px 10px;width:25%}
.s-bt{padding:10px 0 10px 20px;width:37.5%}
.s-bt:after, .s-bt:before, .navi>div>div:before, .navi>div>div:after{height: calc(50% + 29%)}
.s-bt ul li a{padding-left:15px}
.active.s-bt{padding-left:15px}
.webzine li .lt_img{width:120px}
.cont{width:calc(100% - 120px);padding-left:15px}
.webzine li{width:100%}
.copy-start{display:none}
.sub-txt2{margin-top:20px}
#bo_sch select{width:80px !important}
#bo_sch .sch_input{width:130px}

.main-bnr li{padding:0 2px}
.main-bnr li:after{display:none}
.main-bnr li a br{display:block}
.main-bnr li a{background:#f4f4f4;border:1px solid #ddd;}
.main-bnr{border:none}
}

@media only screen and (max-width:420px) {
.foot-block{padding-right:0}
#logo{margin: 15px 5px 17px 0; width: 90px}
.pfixed #logo{width:90px;margin-top:14px}
.search-box{width:calc(100% - 160px);margin-top:12px}
.menu-bt-wrapper {right: 5px;}
.search-box button{height:25px;font-size:14px;width:30px}
.search-box input[type="text"]{height:25px}
.menu-bt-wrapper{top:12px}
.pfixed{height:61px !important}
.cate-box{padding:10px 20px}
.cate-box li{display:block;float:left;width:33.33333%;margin-right:0}
}

@media only screen and (max-width:360px) {
.foot-contact p{margin-top:15px}
}