<style>
    /*일반 문서 페이지 css*/
            ui,li,dl,dd,dt {margin: 0; padding: 0;}
            dd {padding-left: 20px; text-indent: -10px;}
            dd::before {content: "- ";}
            .main_section { position: relative; width: 100%; box-sizing: border-box; overflow: hidden; padding: 10px 1.5% 10px 1.5%; line-height: 1.5;
                word-break: keep-all;}
    
            /*--모바일에서 메인섹션 패딩 0--*/
            @media only screen and (max-width: 600px) {
                .main_section { padding: 0px; }
            }
            /*사진*/
            .content_img {text-align: right; box-sizing: border-box; padding: 0px; /*background-color: red;*/ position: absolute; overflow: hidden; top: 0px; right: 0;}
            
            /*사진 최소 크기들어갈 max-width*/
            .content_img img {width: 145px; height: 145px; display: block; margin: 0 auto; border: 5px solid #f1f1f1; border-radius: 50%;}
            .content_text {overflow: hidden; box-sizing: border-box; width: 100%; padding: 10px 0 0px 0; position: relative; text-align: justify;}
            @media only screen and (max-width: 600px) {
                .content_text {padding: 0px 0 20px 0; text-align: left;}
                .main_section { position: relative; width: 100%; box-sizing: border-box; overflow: hidden; padding: 20px 0px; padding: 10px 1.5% 10px 1.5%; line-height: 1.5; word-break: keep-all;}
            }
            .img_bottom_name { font-weight: 700; color: #4c67b4; text-align: center;}
    
            /*--타이틀 박스 디자인--*/
            .title_wrap { border-bottom: 1px solid #ddd; margin: 20px 0 0px 0;/*--background-color: #cccccc;--*/ background-position: right; background-repeat: no-repeat; background-size: contain; position: relative;}
    
            /*--모바일에서 타이틀 박스 백그라운드 이미지 보이지 않게--*/
            @media only screen and (max-width: 600px) {
                .title_wrap {background-position: -9999px -9999px;}
            }
            /*--택스트--*/
            
            .title_1 {color: #440a67; font-size: 2.5rem; font-weight: 700; margin: 26px 0 30px 0;}}
            .title_1_2{ color: #009688; font-size: 1.4rem; font-weight: 700; margin: 7px 0 10px 0;}
            .title_2 {color: #555;; font-size: 1.4rem; font-weight: 700; margin: 75px 0 30px 0; text-align:left;}
            .title_3 {color: #3b329e; font-size: 1.1rem; font-weight: 600; margin: 35px 0 15px 0;}
            .title_4 {color: #287B24; font-size: 1.0rem; font-weight: 600; margin: 30px 0 10px 0;}
            .title_5 {color: #555; font-size: 1.0rem;  margin: 10px 0 10px 0;} 
            /*--괄호 문자--*/
            .small_title {margin:10px 0 10px 0; font-weight: 800;} 
            .title_99 {position: absolute; top: 63px; right: 0px; font-size: 67px; color: #0000001f; font-weight: 900;}  

            @media only screen and (max-width: 1000px) {.title_99 {font-size: 100px;}  }
            @media only screen and (max-width: 800px) {.title_99 {font-size: 80px;}  }
            @media only screen and (max-width: 600px) {.title_99 {font-size: 60px;}  }
            @media only screen and (max-width: 500px) {.title_99 {font-size: 50px;}  }
            @media only screen and (max-width: 400px) {.title_99 {font-size: 30px;}  }
    
            @media only screen and (max-width: 600px) {
            .title_1 {color: #440a67; font-size: 2rem; font-weight: 700;}
            .title_1_2{ color: #009688; font-size: 1.1rem; font-weight: 700; margin: 7px 0 10px 0;}
            .title_2 {color: #555;; font-size: 1.1rem; font-weight: 700; margin: 60px 0 30px 0;}
            .title_3 {color: #3b329e; font-size: 1.1rem; font-weight: 600; margin: 35px 0 15px 0;}
            .title_4 {color: #287B24; font-size: 1.0rem; font-weight: 600; margin: 30px 0 10px 0;}
            .title_5 {color: #555; font-size: 1.0rem;  margin: 10px 0 10px 0;}
            
            }
    
            .content_text .content_item {padding: 0px 0px 0px 00px; border: 0px solid #cccccc;}
            .content_text .content_item ul {padding: 10px 0px 0 0; }
            .content_text .content_item> li {text-indent: 1em; padding: 0px 0 10px 0;}
            .content_text> .content_item> li> ul> li {text-indent: 2em;}
            .content_item img { width: 30%; height: auto; display: block; padding: 0 0 0 0; margin: 0 20px 0 0; border: 0px solid #f1f1f1; border-radius: 5%; box-sizing: border-box; }
            .content_item .manpic{float:left;}
    
            @media only screen and (max-width: 600px) {
                .content_item .manpic { float: none; width: 80%; margin: 10px auto 20px; }
                /*.clearfix::after {content: ""; clear: both;}*/
            }
            @media only screen and (max-width: 600px) {
                .content_text .content_item {padding: 10px 10px 10px 10px;}
            }
    
/*---아이템 이미지 박스--*/    
            .item-list { display: block; margin-top: 0px; overflow: hidden; }            
            .item-list li:nth-child(3){}

/*---아이템 이미지 마우스 오버시 박스 새도우 효과--*/
			.item-list li {display: block; background: #fff; color: #202020; border-radius: 5px; border: 0px solid #c6c6c6;
            -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; text-align:center;}
            /*---.item-list li:hover {-webkit-box-shadow: 0px 10px 7px 0px rgba(0, 0, 0, 0.26);  box-shadow: 0px 10px 7px 0px rgba(0, 0, 0, 0.26);
            opacity: 1; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;     }--*/

/*---아이템 이미지 마우스 오보시 이미지 확대 효과--*/
			.item-list li img {-webkit-transition: all 0.4s ease; transition: all 0.4s ease; }
			.item-list li:hover img { -webkit-transform: scale(1.2); 	transform: scale(1.2); }

    
    .item-list .item .item_img{width: auto; height: 110px; margin-bottom: 1.5rem; border-radius: 5px; margin: 0 auto; max-width: 113px;}
					 .item img {width: 100%; margin-bottom: 0;  }
					 .item {width: 32%; float: left; }
					 .item1 {margin: 0 1% 0 0; }
					 .item2 {margin: 0 1% 0 1%; }
					 .item3 {margin: 0 0 0 1%; }
    
    
    
    /*
           @media (max-width: 800px) {		              
               .item {width: 48%; }
               .item1 {margin: 0 2% 20px 0; }
               .item2 {margin: 0 0 20px 2%; }
               .item3 {width: 100%; margin: 0 0 20px 0;}
            }
    */
            
            @media (max-width: 600px) {}
    
            @media (max-width: 500px) {
                .item {width: 48%; }
                .item1 {margin: 0 1% 5px 1%; }
                .item2 {margin: 0 1% 5px 1%; }
                .item3 {margin: 0 1% 5px 1%; }
    /*
                .item-list nth-child(odd) {margin: 0 2% 20px 0; }
                .item-list nth-child(even) {margin:0 0 20px 2%; }
    */
            }
    
    .item-list .item_img .item_img{width: auto;
        height: 110px;
        margin-bottom: 1.5rem;
        border-radius: 5px;
        margin: 0 auto;
        max-width: 113px;}
            .item_img img {width: 100%; margin-bottom: 0; border-radius: 5px 5px 0 0; vertical-align: top;}
    
    .item_img {width: 32%; float: left;}
    .imgbox{ border-radius: 5px; overflow: hidden;}
    
    .nofloat{float:none;}
    .item_img:nth-child(1){margin: 0 1% 0 0;}
    .item_img:nth-child(2){margin: 0 1% 0 1%; }
    .item_img:nth-child(3){margin: 0 0 0 1%;}
    
    @media (max-width: 600px) {
        .item_img {width: 49%; float: left;}
        ..item_img:nth-child(1) {margin: 0 1% 25px 1%; }
                .item_img:nth-child(2) {margin: 0 0% 25px 1%; }
                .item_img:nth-child(3){width:100%; margin: 0 0 15px 0%; }
        .nofloat{float:none;}
    
    }
    
    
    
    /*연혁 관련 css--------------------------------------------*/
    
    
    @media screen and (max-width: 768px) and (min-width: 300px){
    p {width: 100%; margin: 0 auto; line-height: 150%; 	}
    }
    
    #pagewrap {width: 100%; box-sizing: border-box; overflow: hidden; padding: 0px 0% 10px 0%; line-height: 1.5; word-break: keep-all; }
    
    @media screen and (max-width: 1199px) and (min-width: 300px){
    #pagewrap {width: 100%; margin: 0 auto;}
    }
    
    @media screen and (max-width: 972px) and (min-width: 300px){
    #pagewrap {float: none; width: 100%; margin: 0 auto; }
    }
    
    .con_box {width: 100%; height: auto; }
    
    @media screen and (max-width: 971px) and (min-width: 300px){
    .con_box {float: none; width: 100%; margin: 0 auto;}
    }
    
    .history_box .box {	margin-top:20px; width: 100%; height: auto; overflow: hidden;}
    .history_box p {float: right; width: 80%; height: auto; border-top: 1px solid #e1e1e1; padding: 20px 0; color: #797979; line-height: 160%; overflow: hidden;}
    @media screen and (max-width: 971px) and (min-width: 300px){
    .history_box p {width: 100%; margin:20px 0 0 0;	}
    }
    
    .history_box h4 {float: left; width: 15%; font-size: 23px; color: #ae2c1b; text-align: center; border-top: 1px solid #ae2c1b; padding: 20px 0 0 0;}
    
    @media screen and (max-width: 971px) and (min-width: 300px){
    .history_box h4 { width: 100%;}
    }
    
    .history_box ul {float: right; width: 80%; height: auto;}
    
    @media screen and (max-width: 971px) and (min-width: 300px){
    .history_box ul {width: 100%; padding: 20px 0 0 0;	}
    }
    
    .history_box ul li {border-top: 1px solid #e1e1e1; padding: 20px 0; color: #797979; line-height: 160%; overflow: hidden;}
    .history_box ul li strong {float: left; display: block; font-size: 18px; color: #453932; line-height: 140%; width: 20%;}
    .history_box ul li span {float: left; display: block; line-height: 140%; width: 80%;}
    
    @media screen and (max-width: 736px) and (min-width: 300px){
    .history_box p, .history_box ul li strong, .history_box ul li span {width: 100%;}
    }
    
    .sh_poem1 .box {padding: 5% 0 0 0;}
    .line {border-top: 0px solid #d6d6d6;}
        
    .sh_poem1 .box h4 {font-size: 25px; line-height: 130%; color: #90a710;}
    
    @media screen and (max-width: 736px) and (min-width: 300px){
        .sh_poem1 .box h4 {font-size: 20px; letter-spacing: -0.03em;}
    }
        
    .sh_poem1 .box p {padding: 10px 0 0 0;}
    .sh_poem1 .box {padding: 0 10px 175px 10px;}
        
    @media screen and (max-width: 736px) and (min-width: 300px){
        .sh_introduce {background-size: 200px; background-position: 100% 3%;}
        .sh_poem1 .box {padding: 5% 0px 15px 0px;}
        }
    
    .sh_introduce .t_box{overflow: hidden;}
    .sh_introduce .t_box p{    float: left;}
    .sh_introduce .t_box p img{vertical-align: top;    border: 0px;}
        
    @media screen and (max-width: 736px) and (min-width: 300px){
        .sh_introduce .t_box p img {width: 180px;}
    }
        
    .sh_introduce .t_box h4 {float: left; font-size: 30px; line-height: 130%; padding: 150px 0 0 20px;}
    
    @media screen and (max-width: 971px) and (min-width: 300px){
        .sh_introduce .t_box h4 {padding: 30px 0 0 20px;}
    }
    @media screen and (max-width: 736px) and (min-width: 300px){
        .sh_introduce .t_box h4 {font-size: 20px; padding: 20px 0 0 10px;}
    }
    .nb {display: block;}
    .sh_introduce .box p {padding: 30px 0 0 0;}
    .sh_book h3 {font-size: 25px; line-height: 130%; text-align: center;}
    
    @media screen and (max-width: 736px) and (min-width: 300px){
    .sh_book h3 {font-size: 18px;}
    }
    .sh_book ul {margin: 50px 0 0 0;}
    .sh_book ul li {float: left; width: 23%; height: auto; text-align: center; margin: 0 1% 50px 1%;}
        
    @media screen and (max-width: 971px) and (min-width: 300px){
        .sh_book ul li {width: 31.33%;}
    }
    @media screen and (max-width: 736px) and (min-width: 300px){
        .sh_book ul li {width: 43%;}
    }	
    .sh_book ul li strong {display: block; color: #797979; border-top: 1px solid #eee; padding: 20px 0 0 0; margin: 20px 0 0 0; line-height: 130%; font-weight: normal;}
    
    @media screen and (max-width: 971px) and (min-width: 300px){
        .sh_book ul li strong {height: 50px;}
    }	
    
    /*연혁 css end--------------------------------------------*/
    
    
    
    /*찾아오시는 길 css------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
        .subtopimg {
            margin-top: -9px;
            background-image: url(<?=$view->themeUrl?>/images/desktop/main/sub_visual1_7.jpg);
            height: 450px;
            color: #fff;
            text-align: center;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center 0;
        }
    
        @media screen and (max-width: 841px) {
            .subtopimg {height: 320px; background-position: 60% center; -webkit-background-size: auto 320px; background-size: auto 320px;}
        }
    
        .subtopimg h3 {font-weight: 600; font-size: 43px; padding-bottom: 15px; padding-top: 165px; text-transform: uppercase; }
    
        @media screen and (max-width: 841px) {
            .subtopimg h3 {font-size: 30px; padding-top: 115px; }
        }
    
        .subtopimg p {font-size: 20px;}
    
        @media screen and (max-width: 841px) {
            .subtopimg p {font-size: 16px; padding-left: 50px; padding-right: 50px; -ms-word-break: keep-all;  word-break: keep-all;  }
        }
    
        /*본문내용*/
        .box_map {margin: 0 0 10px 0;}
    
        @media screen and (max-width: 841px) {
            .wrap-contact .box_map {margin-bottom: 30px;}
            .box_map {margin: 40px 0 20px 0; }
            .inr-c {width: 1128px; margin-left: auto; margin-right: auto; position: relative;}
        }
    
        @media screen and (max-width: 1220px) {
            .inr-c {margin-left: 0px; margin-right: 0px; width: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
        }
    
        @media screen and (max-width: 841px) {
         
        }
    
        .container .infomation {border-top: 0px solid #d1d1d1;}
        .infomation .lst {padding: 60px 30px; border-bottom: 1px solid #d1d1d1; position: relative;}
    
        @media screen and (max-width: 841px) {
            .infomation .lst {padding: 30px 20px;}
        }
    
        .infomation .lst .h {float: left; font-size: 27px; line-height: 1; padding-left: 75px; position: relative; margin-top: 12px; color: #000;}
    
        @media screen and (max-width: 841px) {
            .infomation .lst .h {float: none; font-size: 16px; padding-left: 50px;}
        }
    
        .lst.n1 .h::after {position: absolute; left: 0; top: 50%; display: inline-block; overflow: hidden; text-align: left; vertical-align: middle; text-indent: -9999px;
            background-image: url(?=$view-themeUrl?/images/desktop/new/ico_contact1.jpg);
            background-repeat: no-repeat; *display: inline; *zoom: 1; background-position: 0px 0px; width: 64px; height: 64px; content: ""; margin-top: -32px;
        }
    
        .lst.n2 .h::after {position: absolute; left: 0; top: 50%; display: inline-block; overflow: hidden; text-align: left; vertical-align: middle; text-indent: -9999px;
            background-image: url(?=$view-themeUrl?/images/desktop/new/ico_contact2.jpg);
            background-repeat: no-repeat; *display: inline; *zoom: 1; background-position: 0px 0px; width: 64px; height: 64px; content: ""; margin-top: -32px;
        }
    
        .lst.n3 .h::after {
            position: absolute; left: 0; top: 50%; display: inline-block; overflow: hidden; text-align: left; vertical-align: middle; text-indent: -9999px;
            background-image: url(?=$view-themeUrl?/images/desktop/new/ico_contact3.JPG);
            background-repeat: no-repeat; *display: inline; *zoom: 1; background-position: 0px 0px; width: 64px; height: 64px; content: ""; margin-top: -32px;
        }
    
        @media screen and (max-width: 841px) {
    
            .infomation .lst.n1 .h:after, .infomation .lst.n2 .h:after, .infomation .lst.n3 .h:after {
                width: 40px; height: 40px; -webkit-background-size: 100%; background-size: 100%; margin-top: -20px; }
        }
    
        .infomation .lst .cont {margin-left: 210px; font-size: 17px; line-height: 1.76470588;}
    
        @media screen and (max-width: 841px) {
            .infomation .lst .cont {margin-top: 25px; margin-left: 0; font-size: 14px;}
        }
    
        .infomation .lst.n3 { margin-bottom: 100px;}
    
        @media screen and (max-width: 841px) {
            .infomation .lst.n3 {margin-bottom: 40px;}
        }
    
    /*찾아오시는 길 css end*/