
/* ??u ?????? */
#wrap {}
#header {position:absolute; top:0; left:0; width:100%; height:auto; background:#f9f9f9; z-index:100}
#footer {clear:both; padding:50px 0; background:#000}
/* ??? ???? */
#header.scroll {position:fixed; left:0; width:100%; background:rgba(255,255,255,.8)}
#header > .topbar {background:#005748}
#header > .topbar > .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#header > .topbar > .inner:after {clear:both; display:block; content:''}
#header > .topbar > .inner ul li {display:inline-block; font-size:14px; color:#aaa; line-height:40px}
#header > .topbar > .inner ul li a {font-size:12px; color:#aaa; transition:all .3s ease}
#header > .topbar > .inner ul li a:hover {font-size:12px; color:#eee}
#header > .topbar > .inner ul li i {margin-right:8px}
#header > .topbar > .inner .left {float:left}
#header > .topbar > .inner .right {float:right}
#header > .topbar > .inner .left ul li {margin-right:15px}
#header > .topbar > .inner .right ul li {margin-left:15px}
#header > .topbar > .inner .right ul li i {margin:0}
#header > .navbar {position:relative; max-width:1400px; height:90px; margin:0 auto; padding:0 60px}
#header > .navbar:after {clear:both; display:block; content:''}
#header h1 {float:left; width:200px; padding-top:20px}
#header h1 img {display:block; width:100%}
#gnb_wrap {height:100%}
#gnb_wrap:after {clear:both; display:block; content:''}
#gnb_wrap a.gnb_top {display:none}
#gnb_wrap button {display:none}
#gnb {float:right; height:100%}
#gnb > li {position:relative; float:left; height:100%}
#gnb > li > a > span {position:relative; padding-bottom:10px}
#gnb > li > a > span:before {position:absolute; bottom:0; left:0; width:0; height:2px; content:''; background:#000; transition:all .4s ease}
#gnb > li:hover > a > span:before {width:100%}
#gnb > li > a {display:block; position:relative; padding:28px 25px 0 25px; height:100%; /*font-family:'Montserrat';*/ color:#444; z-index:50; font-size:18px;}
#gnb > li > ul.submnu {display:none; position:absolute; top:70px; left:0; min-width:160px; padding:0 20px; border-bottom:1px solid #aaa; background:#fff; opacity:0; filter:alpha(opacity='0'); z-index:110}
#gnb > li.on > ul.submnu {display:block}
#gnb > li > ul.submnu li {position:relative; padding:5px 0; border-bottom:1px solid #eee}
#gnb > li > ul.submnu li:last-child {border-bottom:none}
#gnb > li > ul.submnu li:last-child:before {display:none}
#gnb > li > ul.submnu li:before {position:absolute; bottom:0; left:0; width:0; height:1px; content:''; background:#aaa; transition:all .3s ease}
#gnb > li > ul.submnu li:hover:before {width:100%}
#gnb > li > ul.submnu li:hover a{color:#333}
#gnb > li > ul.submnu li a {display:block; width:100%; height:100%; line-height:30px; color:#888}
#btnNav {display:none; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer; z-index:1000}
#btnNav span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
#btnNav span.bar1 {top:12px}
#btnNav span.bar2 {top:18px}
#btnNav span.bar3 {top:24px}
#btnNav.active span.bar1 {top:18px; transform:rotate(45deg)}
#btnNav.active span.bar2 {display:none}
#btnNav.active span.bar3 {top:18px; transform:rotate(-45deg)}
/* ??? ????? ??? */
#scrollTop {display:none; position:fixed; bottom:70px; left:0; width:auto; height:50px; z-index:100}
#scrollTop .inner {max-width:1400px; margin:0 auto; padding:0 50px; text-align:right}
#scrollTop .inner a {position:relative; display:inline-block; width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#555}
#scrollTop .inner a img {position:absolute; top:35%; left:35%; transition:all .4s ease}
#scrollTop .inner a span {position:absolute; width:100%; top:0; left:50%; font-size:13px; font-weight:600; margin-left:-22px; line-height:45px; opacity:0; filter:alpha(opacity='0'); transform:rotate(-360deg); transition:all .4s ease}
#scrollTop .inner a.on img {opacity:0; transform:rotate(360deg)}
#scrollTop .inner a.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
/* ?????? ??? */
#call_button {display: none;}
.m_foot_bt {display: none;}
/* ??? ???? */
#footer .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#footer .inner:after {clear:both; display:block; content:''}
#footer .logo {float:left; padding-top:10px; width:170px}
#footer .logo img {display:block; width:100%}
#footer .info {float:left; margin-left:50px; color:#aaa}
#footer .info address {color:#aaa}
#footer .info ul li {display:inline-block; margin-right:10px; color:#aaa}
#footer .info ul li span {color:#ddd}
#footer .info p.copyright {color:#aaa}
#footer a {color:#aaa !important}


/* ???? ???? */
@media screen and (min-width:1280px) {
 /* ??? ???? */
 #gnb {margin-right:0px}
}
@media screen and (max-width:1024px) {
 /* ??? ???? */
 #header > .topbar {display:none}
 #header h1 {width:120px; padding-top:17px}
 #gnb_wrap {position:fixed; top:0; right:-270px; width:250px; height:100%; background:#fff; box-shadow:-2px 0 6px 0 rgba(0,0,0,.3); z-index:990;}
 #gnb_wrap a.gnb_top {position:relative; display:block !important; padding:0 0 0 25px; height:80px; font-size:16px; color:#fff; line-height:80px; background:#555}
 #gnb_wrap a.gnb_top > span.nav-home {display:inline-block; width:17px; height:16px; margin-right:10px; background:url(../image/nav_home.png) 0 0 no-repeat; vertical-align:-2px}
 #gnb_wrap button {display:block; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer}
 #gnb_wrap button span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
 #gnb_wrap button span.bar1 {top:12px}
 #gnb_wrap button span.bar2 {top:18px}
 #gnb_wrap button span.bar3 {top:24px}
 #gnb_wrap button.active span.bar1 {top:18px; transform:rotate(45deg)}
 #gnb_wrap button.active span.bar2 {display:none}
 #gnb_wrap button.active span.bar3 {top:18px; transform:rotate(-45deg)}
 #gnb {float:none}
 #gnb > li {float:none; height:auto}
 #gnb > li > a {height:auto; padding:15px 25px; font-size:16px; border-bottom:1px solid #dedede}
 #gnb > li > a > span {padding:0}
 #gnb > li > a > span:before {display:none}
 #gnb > li > ul.submnu li:before {display:none}
 #gnb > li.dropdown > a:before {position:absolute; display:block; width:2px; height:14px; right:31px; top:50%; margin-top:-7px; content:''; background:#aaa; transition:all .3s ease}
 #gnb > li.dropdown > a:after {position:absolute; display:block; width:14px; height:2px; right:25px; top:50%; margin-top:-1px; content:''; background:#aaa}
 #gnb > li.open > a:before {transform:rotate(90deg)}
 #gnb > li > ul.submnu {display:none; position:static; width:100%; padding:0; background:#f6f6f6; opacity:1 !important; filter:alpha(opacity='100') !important; box-shadow:none}
 #gnb > li > ul.submnu li {padding:0; border-color:#dedede}
 #gnb > li > ul.submnu li a {font-size:15px; padding:10px 25px}
 #gnb_mask {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.6; filter:alpha(opacity='60'); z-index:200}
 #btnNav {display:block; top:15px}
 /* ??? ???? */
 #footer .logo {float:none; margin:0 auto 30px auto; padding:0; text-align:center}
 #footer .info {float:none; margin:0; text-align:center}
}
@media screen and (max-width:640px) {
 /* ??? ???? */
 #header > .navbar {padding:0 20px; height:75px;}
 #header h1 {width:130px; padding-top:20px}
 #btnNav {top:15px; right:20px}
 #gnb_wrap button {right:20px}
 /* ??? ????? ??? */
 #scrollTop .inner {padding:0 20px}

 /* ?????? ??? */
#call_button {display: block;position: absolute;top: 15px; right: 12%;z-index: 101;}
#call_button .inner {padding: 0 30px;}
#call_button .inner a {display: block; padding:0 11px; height: 40px; line-height: 40px;color: #fff;background: #095d4e;text-align: center; border-radius: 3px;}
#call_button .inner a i {font-size: 16px;color: #fff;}
#call_button .inner a span {color: #fff;font-size: 13px;}

/*????? ????*/
.m_foot_bt{display: block;position: fixed; bottom: 0px; width:100%;z-index: 101; background:#21bbb1; z-index:1999}
.m_foot_bt ul{overflow:auto;}
.m_foot_bt ul li{width:33.3%; float:left; border-right:1px solid #1c948c;}
.m_foot_bt ul li a {color:#fff; display:block; padding:17px 0px; width:100%; height:100%; text-align:center; font-size:13px; font-weight:bold; letter-spacing:1px; }
.m_foot_bt ul li a.tel {letter-spacing:-1px; }
.m_foot_bt ul li a.blog {letter-spacing:-1px; }

 /* ??? ???? */
 #footer {padding:30px 0 80px;}
 #footer .inner {padding:0 20px}
 #footer .logo {width:95px}
 #footer .info address, #footer .info p {font-size:12px}
}

 #phone_wrap {position:fixed; top:218px; right:120px; width:237px; height:477px; background:url(../image/phone.png) center top no-repeat; box-sizing:border-box; z-index:990; overflow:hidden; padding:50px 0 55px; display:none}
 #phone_wrap .phone_area {width:100%; height:100%; overflow-y:scroll; -ms-overflow-style:none}
 #phone_wrap .phone_area::-webkit-scrollbar {display:none;}
 #mainCounsel {padding:0 13px 55px 15px;box-sizing:border-box}
 #mainCounsel .title {padding:15px 0; text-align:center; background:#c1a24b}
 #mainCounsel .title h3 {font-size:16px; font-weight:600; color:#fff}
 #mainCounsel .formmail_title_bgcolor {font-family:inherit !important; font-weight:600; text-align:right; background:#fff !important}
 #mainCounsel .formmail_title_bgcolor font {color:#a2873b !important}
 #mainCounsel .formmail_cell_bgcolor {font-size:0 !important}
 #mainCounsel table {width:100%; margin-bottom:20px; table-layout:fixed}
 #mainCounsel table tbody td {padding:5px; border-bottom:1px solid #d5d5d5}
 #mainCounsel table tbody td, #mainCounsel table tbody td font {font-size:12px !important}
 #mainCounsel table tbody tr td:last-child {width:100% !important}
 #mainCounsel table tbody tr td[align='left']:first-child {width:100% !important;display:none;}
 #mainCounsel table tbody tr td[align='right']:last-child {width:100% !important;text-align:left;}

 #mainCounsel table tbody td select {font-size:12px; max-width:90%; height:25px; border:1px solid #dedede}
 #mainCounsel table tbody td input[type=text] {max-width:100%;width:100%;font-size:13px; height:25px; border:1px solid #dedede}
 #mainCounsel table tbody td input[name^=phone_no] {width:34px; margin-left:2px}
 #mainCounsel table tbody td input[name^=phone_no]:first-child {margin-left:0}
 #mainCounsel table tbody td textarea {max-width:100%; height:80px !important; border:1px solid #dedede}
 #mainCounsel .btn-area {text-align:center}
 #mainCounsel .btn-area > a {display:inline-block; padding:10px 20px; font-size:15px; color:#fff; background:#cba865; transition:all 0.3s ease}
 #mainCounsel .btn-area > a:hover {background:#a2873b}
 #mainCounsel .btn-close {position:absolute; display:block; bottom:12px; left:103px; width:32px; height:32px; font-size:0; text-indent:-9999em; border:2px solid #fff; border-radius:50%; box-sizing:border-box}
 #mainCounsel .btn-close > span {position:absolute; display:block; top:50%; left:50%; width:14px; height:2px; margin-left:-7px; margin-top:-1px; border-radius:2px; background:#fff}
 #mainCounsel .btn-close > span.line1 {transform:rotate(45deg)}
 #mainCounsel .btn-close > span.line2 {transform:rotate(-45deg)}
 #mainCounselMini {display:block; position:fixed; top:450px; right:20px; z-index:990}
 #mainCounselMini img {display:block}

@media screen and (max-width:1024px) {
 #mainCounselMini {display:none !important;}
 #phone_wrap {display:none !important;}
}




.mobile_inquiry {display:none;width:100%;box-sizing:border-box;position:fixed;bottom:60px;margin-bottom:-400px;transition:all 0.3s ease;z-index:999;padding:20px;background:#f1f1f1;}
.mobile_inquiry.open {margin-bottom:0px;transition:all 0.3s ease;}
.mobile_inquiry .formmail_title_bgcolor {background:#f1f1f1;display:none;}
.mobile_inquiry .formmail_cell_bgcolor {background:#f1f1f1;}
.mobile_inquiry .formmail_cell_bgcolor table td:first-child {display:none;}
.mobile_inquiry .formmail_cell_bgcolor {padding-left:0px !important;}
.mobile_inquiry .formmail_cell_bgcolor table td {font-size:12px;text-align:left;}
.mobile_inquiry .formmail_cell_bgcolor table td input {width:auto;-webkit-appearance: checkbox;margin-right:0px;margin-bottom:0px;height:auto;}
.mobile_inquiry .formmail_cell_bgcolor {width:100%;padding-left:0px;font-size:0px;}
.mobile_inquiry .formmail_cell_bgcolor input[name='name'] {width:100%;font-size:12px;}
.mobile_inquiry .formmail_cell_bgcolor input[name='phone_no1'] {margin-right:10px;}
.mobile_inquiry .formmail_cell_bgcolor input[name='phone_no2'] {margin-right:10px;}
.mobile_inquiry .formmail_cell_bgcolor textarea {width:100%;padding:5px 10px;font-size:12px;border:solid 1px #d1d1d1;}
.mobile_inquiry .formmail_cell_bgcolor input {height:35px;width:100%;font-size:12px;padding:5px 0px;margin-bottom:10px;border:solid 1px #d1d1d1;}
.mobile_inquiry .formmail_cell_bgcolor select {width:100%;height:35px;font-size:12px;padding:5px 10px;margin-bottom:0px;border:solid 1px #d1d1d1;}
.mobile_inquiry .btn-area {text-align:center;width:100%;margin:0px auto;}
.mobile_inquiry .btn-area a {width:30%;background:#000;color:#fff;padding:8px 20px;display:inline-block;margin-top:50px 0px;}
.mobile_inquiry .btn-allmenu {width:auto !important;height:auto !important;}
.agree-allMenu {position:absolute;/*right:170px;bottom:91px;*/z-index:999}
.agree_box > input[type="checkbox"] {position:relative;top:2px;}
#all-menu2.agreePopup {display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1500}
#all-menu2.agreePopup .mask {position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.8; z-index:1590}
#all-menu2.agreePopup .menu-layer {position:fixed; top:0px; width:100%; height:100%; margin:0px; background:#fff; z-index:1600;padding:20px; overflow-y:scroll}
#all-menu2.agreePopup.mobileAgree .menu-layer {position:fixed; top:10%; left:5%; width:90%; height:70%; margin:0; background:#fff; z-index:1600;padding:20px; overflow-y:scroll}
#all-menu2.agreePopup .menu-layer h2 {margin-bottom:20px;}
#all-menu2.agreePopup .menu-layer span {width:100%;height:auto;background:#efefef;margin-top:20px;display:block;padding:20px;}
#all-menu2.agreePopup .btnClose2 {position:absolute;right:10px;top:10px;z-index:9999;color:#000;}

.tbl_formmail input[type=text], .tbl_formmail input[type=password] {height:40px !important;}
.formmail_btn {margin:20px 0px;}
#all-menu.agreePopup .mask {position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.8; z-index:1590}
#all-menu.agreePopup .menu-layer {top:0px;left:0px !important;margin:0px !important; width:100% !important; height:100% !important;  }
#all-menu .m_gein_close {position:absolute;right:10px;top:10px;z-index:9999;}

@media screen and (max-width:1024px) {
.mobile_inquiry  {display:block;}
}


.list_content{
    float: left;
    width: 100%;
    padding-bottom:50px;
}
.list_content .list_box_img{
    width: 50%;
    float: left;
}
.list_content .list_box_img img{
    width: 90%;
    margin-right: 10%;
}
.list_content .list_box_info{
    width: 50%;
    float: left;
}
.list_content .list_box_info .list_box_info_title{
    width: 100%;
    float: left;
}
.list_content .list_box_info .list_box_info_title h1{
    font-size: 30px;
    font-weight: bold;
    float: left;
    margin-right: 1rem;
    color: #000;
}
.list_content .list_box_info .list_box_info_title span{
    font-size: 20px;
    color: #005748;
}
.list_content .list_box_info .list_box_info_title_en{
    font-size: 20px;
    color: #666;
    letter-spacing: 2px;
}
.list_content .list_box_info .list_box_info_email{
    font-size: 20px;
    margin: 1rem 0
}
.list_content .list_box_info .list_box_info_email b{
    color: #005748;
}
.list_content .list_box_info .list_box_info_txt{
    width: 100%;
    float: left;
    font-size: 16px;
    margin-top: 1rem;
}
.list_content .list_box_info .list_box_info_txt b{
    color: #005748;
    font-size: 18px;
}
.list_content .list_box_info .list_box_info_txt p{
    font-size: 16px;
}
.list_content .list_box_info .list_box_info_txt h3{
    font-size: 24px;
    font-weight: bold;
    color: #000;
}

@media screen and (max-width:768px) {
	.list_content .list_box_img{
		width: 100%;
		float: left;
	}
	.list_content .list_box_img img{
		width: 90%;
		margin: 0 auto 2rem;
	}
	.list_content .list_box_info{
		width: 100%;
		float: left;
	}
}