/*공통 css */
#container_wr{margin-top: 55px;}
#container_wr.sub{padding: 0px 10px 10px 10px;}
.title{height:100px !important;}
.title h2{ font-size: 30px !important;}
#container_title{height: 100px !important;}
#container_title span{line-height: 100px !important;}
#top_btn{width: 40px; height: 40px; line-height: 40px;}
.navigator ul li a{font-size: 12px; padding: 0px 10px !important;}

/*head css*/
#hd{position: fixed; width: 100%;  display: block; background: #fff; z-index: 99999;height: 55px; top: 0px;}
#hd .wrap{max-width: 720px; width: 100%;}
#hd .wrap .hd_box{height: 100%;}
#hd .wrap .hd_box > div{padding: 10px;}
#hd .wrap .hd_box > div > a > img{width: 110px;}

.mb_gnb{display: block; position : relative; width : 30px; height : 30px; margin-right: 30px; margin-bottom: 10px;}
.menu-trigger, .menu-trigger span { display : inline-block; transition : all .4s; 	box-sizing : border-box;}
.menu-trigger { position : relative; 	width : 30px; height : 30px;}
.menu-trigger span { position : absolute; left : 0; width : 100%;  height : 4px; background-color : #000;	border-radius : 4px;}
.menu-trigger span:nth-child(1) {	top : 0;}
.menu-trigger span:nth-child(2) {	top : 8px;}
.menu-trigger span:nth-child(3) { bottom : 10px;}
#hd .wrap .hd_box.active{height: auto; width: 100%; z-index: 9999; background: #fff; border-bottom: 1px solid #e1e1e1;}
#hd .wrap .hd_box.active .mb_gnb .menu-trigger span:nth-child(1) { transform : translateY(10px) rotate(-45deg); top: -4px}
#hd .wrap .hd_box.active .mb_gnb .menu-trigger span:nth-child(2) { opacity : 0;}
#hd .wrap .hd_box.active .mb_gnb .menu-trigger span:nth-child(3) { transform : translateY(-15px) rotate(45deg); bottom: 5px;}

.gnb{visibility: hidden;position: absolute; background: #fff; z-index: 9999; transition:all 0.5s; width:100%;top: 54px; height: 0px; overflow: hidden}
#hd .wrap .hd_box .gnb ul{display: grid; }
#hd .wrap .hd_box .gnb ul li{border-bottom: 1px solid #e1e1e1; }
#hd .wrap .hd_box .gnb ul li:last-child{border-bottom: 0px;}
#hd .wrap .hd_box .gnb ul li a{padding: 20px 25px;}
#hd .wrap .hd_box.active .gnb{visibility: visible; height: 100%; position: fixed;}

.sub-title{line-height: 100% !important; height: 150px !important;}


/*swiper css*/
.main-banner .swiper{overflow: hidden;}
.main-banner .swiper-button-prev{left: 10px;}
.main-banner .swiper-button-next{right: 10px;}

/*index css*/
.main-slide h3{font-size: 23px; padding: 15px 0px;}
.main-slide .slide{height:350px; width: 100%;}
.main-slide .slide > .txt{padding-top: 10px;}
.main-slide .slide > .txt > p{display: none;}
.main-slide .slide > div.img i{position: unset;}

.section{margin: 0px;}
.section .title{padding-left: 10px !important; height: auto !important;}
.section .title h2{font-size: 25px;}
.s-type .con > ul{flex-wrap:wrap;}
.s-type .con > ul > li{width: 50%;padding-top: 0px; margin-right: 0px; padding: 15px;}
.s-type .con > ul > li > a{padding: 20px;}
.s-type .con > ul > li > a > img{padding: 10px;}
.s-type .con > ul > li > p{padding-top: 0px;}

.section .tel{padding-left: 10px;}
.pic_lt{padding: 10px;}
.pic_lt li{width: 50%}

.gallery01 .con .pic_lt li{height: 100%;}
.gallery01 .con .pic_lt li .lt_img img{height:200px;}
.gallery01 .con .pic_lt li > a:nth-child(2){display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; font-size: 15px; padding: 15px;}

.gallery02 > .category > ul{padding-left: 10px;}
.gallery02 .con .pic_lt{margin-bottom: 0px;}

.banner{padding: 15px;}

/*footer css*/
#ft{position: relative; padding: 5px 0px;}
#ft >.wrap >.ft_box >ul:first-child{width: 40%}
#ft >.wrap >.ft_box >ul:first-child > li > #logo{ margin: 0px 0px 10px; padding-left: 10px;}
#ft >.wrap >.ft_box >ul:first-child > li > #logo > a > img{width: 130px;}
#ft >.wrap >.ft_box >ul:first-child > li > p {padding-left: 10px; padding-bottom: 5px !important; font-size: 13px;}
#ft >.wrap >.ft_box >ul:first-child > li:last-child > p {font-size: 12px; padding-top: 5px;}
#ft >.wrap >.ft_box >ul:nth-child(2){margin-top: 50px; text-align: right;}
#ft >.wrap >.ft_box >ul:nth-child(2) > li{padding-left: 10px;}
#ft >.wrap >.ft_box >ul:nth-child(2) > li > .ft_gnb > ul > li > a{font-size: 12px;}
#ft >.wrap >.ft_box >ul:nth-child(2) > li > .ft_gnb > ul > li > a:after{margin: 0px 4px; height: 8px;}
#ft >.wrap >.ft_box >ul:nth-child(2) > li > h2{font-size: 26px; margin-top: 0px;}
#ft >.wrap >.ft_box >ul:nth-child(2) > li:last-child{font-size: 13px;}



/*회사소개 css*/
#ctt{padding: 0px 10px; padding: 100px 0px 0px !important;}
#container_title{font-size: 25px !important;}
.cp_title h2 b{font-size: 35px !important;}

.ctt_message h2{font-size: 20px !important; text-align: left !important;}
.ctt_message p{font-size: 20px !important; text-align: left !important;}
.ctt_message .mobile{display: block !important;}
.company_img_bg{display: none !important;}


#company {flex-wrap:wrap;margin-top: 20px !important;}
#company:after{bottom: 0 !important; height: 320px !important;}
#company .company_img{height: 300px !important; width:100% !important; box-shadow: 0px 0px 0px 0px !important; left: 0px !important; top: 0px !important;}
#company .company_img > span{padding: 10px !important;}
#company .company_img img{height: 280px !important;}
#company .company_txt{width: 100% !important; padding-top: 10px !important; padding-left: 10px !important;}
#company .company_txt > p{font-size: 16px !important;}
#company .exp pre{font-size: 13px !important;}

.ceo:before{margin: 22px 10px !important;}
.ceo .ceo_txt{font-size: 15px !important; margin-top: 10px !important;}
.ceo .ceo_txt > span{font-size: 20px !important; padding-right: 10px !important;}
.ceo .ceo_txt > img{width: 100px !important;}

/*제품소개 css*/
.pic_lt .lt_more{display: none;}
.chk_box{padding-left: 10px;}
#bo_cate ul{padding-left: 10px; position: inherit; border: 0px}
#bo_cate ul li{display: inline-block; border:0px; width: auto;}
#bo_cate li:nth-child(1), #bo_cate li:nth-child(7), #bo_cate li:nth-child(13){border-left: 0px;}
#bo_cate a{font-size: 15px; padding: 0px 5px;}
.gall_row .col-gn-3{width:50%}
.gall_row .box_clear{clear:inherit;}
#bo_gall .gall_img a{line-height:inherit !important;}
#bo_gall .bo_cnt{display: none;}
#bo_v_title{padding: 10px;}
#bo_v_title .bo_v_tit{font-size: 25px !important; width: 100%}

.product_box{display: grid !important;}
.product_box > div{width: 100% !important}
.product_box .img_box{padding: 80px !important;}
.product_box .img_box a img{width: 100%; height: 100%}
.product_box .content_box{padding-top: 15px !important; padding: 10px;}
.script_box{padding: 10px;}
.gall_row .gal-con-none{width: 100%}

#bo_v_con{padding: 0px 10px;}

/*주문제작 css*/
#bo_gall #gall_ul{padding: 10px; margin: 0;}
.gall_img{height: auto !important;}
#bo_gall .gall_text_href{display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; font-size: 14px; padding: 10px;}
.order_text{display: none;}
#bo_gall .gall_text_href a{font-size: 15px ; padding: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center;}
#bo_gall .notice_img > a > img{margin: 0px !important;}

/*문의하기 css*/
#autosave_wrapper{display: block !important; padding: 10px;}
#autosave_wrapper > ul:nth-child(2){margin-top: 20px; padding: 10px;}
#autosave_wrapper > ul:nth-child(2) > li:nth-child(3) > #wr_2{width: 35% !important;}
#map{width: 100% !important;}
#autosave_wrapper > ul:first-child .company_info > span{flex-wrap:wrap; font-size: 17px !important;}
#autosave_wrapper > ul:first-child .company_info > span > b{width: 100%}
#autosave_wrapper > ul:nth-child(2):after{left:0; width: 100%}

/*문의내용 css*/
#inquire > .wrap > .inquire_box > ul > li{display: block;}
#inquire > .wrap > .inquire_box > ul > li > p{width: 100%; margin: 5px 0px;}
#inquire > .wrap > .inquire_box > ul > li > span{width: 100%}
#inquire > .wrap > .inquire_box > ul > .inquire-text > textarea{width: 100%}
#inquire > .wrap > .inquire_box > ul > .inquire-text > p{line-height:inherit;}
.bo_tit .clamp{width: 150px;}