
/* ???? ????? ???? */
/*
#sub_visual {position:relative; margin-top:80px; overflow:hidden}
#sub_visual ul {position:relative; overflow:hidden}
#sub_visual ul li {position:absolute; top:0; left:0; height:400px; z-index:5}
#sub_visual ul li.active {position:relative; z-index:30}
#sub_visual ul li img {display:block; width:100%; height:100%}
*/
#sub_visual {position:relative; margin-top:80px; overflow:hidden}
#sub_visual > .imgList {position:relative; height:400px}
#sub_visual > .imgList > li {position:absolute; top:0; left:0; width:100%; height:400px; background-size:cover !important; z-index:5}
#sub_visual > .imgList > li > img {display:block; width:100%}
#sub_visual > .imgList > li.active {z-index:10}
#sub_visual > .imgList > li.active-last {z-index:8}
#sub_visual > .imgList > li.item1 {background:url(../image/sub_visual1.jpg) center top no-repeat}
#sub_visual > .imgList > li.item2 {background:url(../image/sub_visual2.jpg) center top no-repeat}
#sub_visual > .imgList > li.item3 {background:url(../image/sub_visual3.jpg) center top no-repeat}
/* ??????? ???? */
#container .location_bar {height:60px; border-bottom:1px solid #e6e6e6; background:#fff}
#container .location_bar .inner {max-width:1400px; margin:0 auto; padding:0 50px; text-align:right}
#container .location_bar .inner ul {text-align:right}
#container .location_bar .inner ul li {display:inline-block; color:#888; line-height:60px}
#container .location_bar .inner ul li.divider {margin:0 5px}
#container .location_bar .inner ul li.current {color:#333}
/* ?????? ???? ?????? */
#container > .inner:before {position:absolute; top:0; left:0; content:''; border-left:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner {position:relative; max-width:1300px; margin:0 auto}
#container > .inner:after {clear:both; display:block; content:''; position:absolute; top:0; right:0; border-right:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner .content:before {position:absolute; top:0; left:0; content:''; border-left:1px solid #e6e6e6; width:1px; height:100%}
#container > .inner .content {position:relative; margin-left:250px; min-height:500px; padding:50px}
/* ???? ?????? */
#leftBar {float:left; width:250px; margin-top:-60px}
#leftBar .title {height:160px; padding:20px; background:#1c1c1c; margin-left:1px;}
#leftBar .title h2 {display:inline-block; font-size:20px; font-weight:600; color:#fff}
#leftBar .title span {font-size:12px; font-weight:600; margin-left:10px; color:#fff}
#leftBar a.dropdown {display:none}
#lnb li {border-bottom:1px dotted #dcdcdc}
#lnb li.on a {color:#fff; background:#555}
#lnb li:hover a {color:#fff; text-decoration:underline; background:#555}
#lnb li a {display:block; padding:10px 20px}
#leftBar .box {padding:20px; border-bottom:1px dotted #dcdcdc; background:#f1f3f2}
#leftBar .box h4 {font-size:16px; font-weight:400; color:#333; line-height:1.1; margin-bottom:10px}
#leftBar .box p {color:#666}
#leftBar .box p span {font-size:15px; font-weight:600; color:#444}
/* ?????? ???? ???? */
#container > .inner img.img_tab, #container > .inner img.img_mob {display:none !important}
#container .inner .content .title {margin-bottom:40px}
#container .inner .content .title h2 {font-size:35px; font-weight:600; color:#333; line-height:1.2; margin-bottom:15px}
#container .inner .content .title p {font-size:12px; color:#888; line-height:1.6}
#container .inner .content h3.sub_tit {font-size:22px; font-weight:400; line-height:1.2; color:#555; margin-bottom:30px}
/* COMPANY - ????? */
.content .greeting .grt_tit {margin-bottom:60px}
.content .greeting .grt_tit h3 {font-size:22px; font-weight:600; color:#444; line-height:1.2; margin-bottom:20px}
.content .greeting ul.teamList {text-align:justify; margin-bottom:60px}
.content .greeting ul.teamList:after {display:inline-block; width:100%; content:''}
.content .greeting ul.teamList > li {display:inline-block; width:30%; vertical-align:top}
.content .greeting ul.teamList > li .info {margin-bottom:30px}
.content .greeting ul.teamList > li .info h4 {font-size:18px; font-weight:600; color:#555; line-height:1.1}
.content .greeting ul.teamList > li .info span {font-size:12px; color:#888}
.content .greeting ul.teamList > li .info ul {margin-top:20px}
.content .greeting ul.teamList > li .info ul li {color:#666}
.content .greeting ul.teamList > li .info ul li:before {display:inline-block; width:2px; height:2px; content:''; margin-right:5px; background:#ccc; vertical-align:middle}
.content .greeting ul.teamList > li .imgArea {width:80%; margin:0 auto; border-radius:50%; overflow:hidden}
.content .greeting .info_box {margin-top:30px}
.content .greeting .info_box dl {margin:0; overflow:hidden}
.content .greeting .info_box dl dt {display:block; float:left; width:12%; padding:8px 0; font-weight:600; color:#444; border-bottom:1px dotted #ccc}
.content .greeting .info_box dl dd {display:block; margin-left:15%; padding:8px 0; color:#666; border-bottom:1px dotted #ccc}
/* COMPANY - ???? */
.content .history .history_box {margin-bottom:60px}
.content .history .history_box:after {clear:both; display:block; content:''}
.content .history .history_box .his_tit {margin-bottom:30px; padding-bottom:15px; border-bottom:2px solid #aaa}
.content .history .history_box .his_tit span {font-size:20px; color:#888}
.content .history .history_box .his_tit h3 {font-size:24px; font-weight:600; color:#444; line-height:1}
.content .history .history_box .left {float:left; width:45%}
.content .history .history_box .left p {color:#666; margin-bottom:25px; text-align:justify}
.content .history .history_box .right {float:right; width:50%}
.content .history .history_box .right dl {clear:both; margin:0 0 20px 0; overflow:hidden}
.content .history .history_box .right dl dt {float:left; width:60px; font-size:24px; font-weight:600; color:#444}
.content .history .history_box .right dl dd {margin-left:80px; line-height:2; color:#666}
/* COMPANY - a????o? ?? */
#map {position:relative; height:400px; margin-bottom:30px; overflow:hidden}
.content .map_box {padding:30px; background:#f6f6f6}
.content .map_box ul.map_info li {color:#666}
.content .map_box ul.map_info li:before {display:inline-block; width:3px; height:3px; margin-right:5px; content:''; background:#aaa; vertical-align:4px}
/* BUSINESS - ?????? */
.content .business ul.typeList {text-align:justify; margin-bottom:60px}
.content .business ul.typeList:after {display:inline-block; width:100%; content:''}
.content .business ul.typeList li {display:inline-block; width:23%; vertical-align:top}
.content .business ul.typeList .imgArea {margin-bottom:25px; overflow:hidden}
.content .business ul.typeList .info h4 {font-size:18px; font-weight:400; color:#444; line-height:1; margin-bottom:15px}
.content .business ul.typeList .info p {color:#666}
.content .business ul.processList {text-align:justify; margin-bottom:60px}
.content .business ul.processList:after {display:inline-block; width:100%; content:''}
.content .business ul.processList li {display:inline-block; width:31%}
.content .business ul.processList .imgArea {margin-bottom:20px; overflow:hidden}
.content .business ul.processList .info {padding:10px 15px; background:#ebebeb}
.content .business ul.processList .info.color {background:#555}
.content .business ul.processList .info.color span {color:#fff}
.content .business ul.processList .info span {font-size:15px; color:#777}
/* BUSINESS - ??????? */
.content .business .area_wrap {text-align:justify; overflow:hidden}
.content .business .area_wrap:after {display:inline-block; width:100%; content:''}
.content .business .area_wrap > .area_box {display:inline-block; width:49.5%; margin-bottom:20px; vertical-align:top}
.content .business .area_wrap > .area_box .imgArea {overflow:hidden}
.content .business .area_wrap > .area_box .info {padding:30px; min-height:260px; background:#efefef}
.content .business .area_wrap > .area_box .info h4 {font-size:24px; font-weight:400; color:#444; line-height:1; margin-bottom:40px}
/* ?¢Ò??¥é??? */
.content .customer .btn_wrap {width: 100%;height: 70px;background: #005748;padding: 0 30px;margin-bottom: 40px;}
.content .customer .btn_wrap p {float: left;color: #fff;width: 80%;height: 70px;font-size: 16px;padding: 20px 0;}
.content .customer .btn_wrap a {display: block;float: right;color: #fff;width: 20%;height: 70px;line-height: 70px;font-size: 16px;text-align: right;font-weight: bold;}
.content .customer .btn_wrap a:after {content: '>';margin-left: 15px;}
.content .customer .btn_wrap a i {vertical-align: middle;margin-right: 15px;font-size: 20px;}
/*.content .customer .btn_wrap a i img {vertical-align: middle;margin-right: 15px;}*/
.content .customer .btn_wrap:after {clear: both;}
/* ???? ???? */
@media screen and (max-width:1024px) {
 /* ???? ????? ???? */
 #sub_visual {margin-top: 70px;}
 #sub_visual > .imgList {height:350px}
 #sub_visual > .imgList > li {height:350px}
 /* ???? ???? ?????? */
 #container .location_bar {display:none}
 #container > .inner {border:none}
 #leftBar {float:none; width:100%; margin:0; border-bottom:1px solid #dcdcdc}
 #leftBar:after {clear:both; display:block; content:''}
 #leftBar .title {float:left; width:25%; height:60px; padding:0 0 0 50px}
 #leftBar .title h2 {display:none}
 #leftBar .title span {font-size:18px; margin:0; line-height:60px}
 #leftBar .box {display:none}
 #lnb {margin-left:25%; height:100%}
 #lnb li {position:relative; float:left; height:100%; border-bottom:none; border-right:1px solid #dcdcdc}
 #lnb li a {display:inline-block; padding:0 30px; height:100%; line-height:60px}
 #lnb li.on a:after {position:absolute; bottom:-18px; left:50%; margin-left:-9px; content:''; border-style:solid; border-width:9px; border-color:transparent; border-top-color:#555}
 #container > .inner .content {margin:0; min-height:auto}
 /* COMPANY - ????? */
 .content .greeting .grt_tit p br {display:none}
 .content .greeting ul.teamList > li .info ul li {font-size:12px}
 .content .greeting ul.teamList > li .info span {font-size:11px}
 .content .greeting ul.teamList > li .imgArea {width:70%}
 /* BUSINESS - ?????? */
 .content .business > p br {display:none}
 .content .business ul.typeList li {width:48%; margin-bottom:40px}
 .content .business ul.typeList li .imgArea {max-height:250px}
 .content .business ul.typeList li .imgArea img {margin-top:-20%}
 .content .business ul.processList .info span {font-size:13px}
 /* BUSINESS - ??????? */
 .content .business .area_wrap > .area_box .info {min-height:280px}
}
@media screen and (max-width:768px) {
 #lnb li a {padding:0 14px;}
 #leftBar .title {padding:0 0 0 30px}
.content .customer .btn_wrap p {width: 50%;font-size: 14px;padding: 10px 0;}
.content .customer .btn_wrap a {width: 50%;font-size: 14px;}
}
@media screen and (max-width:640px) {
#container > .inner .content:before {content:''; border-left:0}
 /* ???? ????? ???? */
 #sub_visual > .imgList {height:200px}
 #sub_visual > .imgList > li {height:200px}
 /* ???? ???? ?????? */
 #container > .inner {padding:0 20px}
 #container > .inner .content {padding:0 0 50px 0; border:none}
 #leftBar {position:relative; padding:30px 0 0 0; border:none; overflow:visible; z-index:50}
 #leftBar .title {display:none}
 #leftBar a.dropdown {position:relative; display:block !important; margin-bottom:60px; padding:13px 15px; color:#fff; background:#555}
 #leftBar a.dropdown:after {position:absolute; top:50%; right:15px; width:0; height:0; margin-top:-3px; content:''; border-style:solid; border-width:6px; border-color:transparent; border-top-color:#fff}
 #leftBar a.dropdown.open:after {margin-top:-9px; border-top-color:transparent; border-bottom-color:#fff}
 #lnb {display:none; position:absolute; left:0; top:77px; width:100%; height:auto; margin-left:0; border-top:1px solid #f0f0f0; background:#fff; box-shadow:0 0 2px rgba(0,0,0,.2)}
 #lnb li {float:none; height:auto !important; border:none}
 #lnb li a {display:block; padding:13px 15px; line-height:1; color:#a1a1a1; border-bottom:1px solid #f0f0f0}
 #lnb li:hover a {color:#181818; text-decoration:none; background:none}
 #lnb li.on a {color:#181818; background:none}
 #lnb li.on a span {border-bottom:1px solid #181818}
 #lnb li.on a:after {display:none}
 #container .inner .content h3.sub_tit {font-size:16px; font-weight:600}
 #container .inner .content .title h2 {font-size:24px}
 #container > .inner img.img_mob {display:block !important}
 #container > .inner img.img_pc, #container > .inner img.img_tab {display:none !important}
 /* COMPANY - ????? */
 .content .greeting .grt_tit h3 {font-size:16px}
 .content .greeting ul.teamList > li {width:100%; margin-bottom:30px; padding-top:30px; text-align:center; border-top:1px solid #e6e6e6}
 .content .greeting ul.teamList > li:first-child {border-top:none}
 .content .greeting ul.teamList > li .imgArea {width:160px}
 .content .greeting .info_box dl {border-bottom:1px dotted #ccc}
 .content .greeting .info_box dl dt {width:20%; border:none}
 .content .greeting .info_box dl dd {margin-left:25%; border:none}
 /* COMPANY - ???? */
 .content .history .history_box .his_tit span {font-size:14px}
 .content .history .history_box .his_tit h3 {font-size:18px; margin-top:5px}
 .content .history .history_box .left {float:none; width:100%; margin-bottom:40px}
 .content .history .history_box .left p {font-size:12px}
 .content .history .history_box .right {margin-left:none; width:100%}
 .content .history .history_box .right dl {margin:15px 0; padding:15px 0 0 0; border-top:1px solid #e6e6e6}
 .content .history .history_box .right dl:first-child {border-top:none}
 .content .history .history_box .right dl dt {width:45px; font-size:18px}
 .content .history .history_box .right dl dd {margin-left:60px; font-size:12px}
 /* COMPANY - a????o? ?? */
 #map {height:350px}
 .content .map_box ul.map_info li {font-size:12px}
 /* BUSINESS - ?????? */
 .content .business ul.typeList li {width:100%}
 .content .business ul.typeList .info h4 {font-size:15px}
 .content .business ul.typeList li .imgArea {max-height:initial}
 .content .business ul.typeList li .imgArea img {margin-top:0}
 .content .business ul.processList li {width:100%; margin-bottom:40px}
 .content .business ul.processList li:last-child {margin-bottom:0}
 /* BUSINESS - ??????? */
 .content .business .area_wrap > .area_box {width:100%; margin-bottom:15px}
 .content .business .area_wrap > .area_box .info {min-height:initial; padding:20px}
 .content .business .area_wrap > .area_box .info h4 {font-size:15px; font-weight:600; margin-bottom:20px}
 .content .business .area_wrap > .area_box .info p {font-size:12px}
/* ?¢Ò??¥é??? */
.content .customer .btn_wrap {height: 50px;}
.content .customer .btn_wrap p {display: none;}
.content .customer .btn_wrap a {float: none;width: 100%;text-align: center;line-height: 50px;}
}


/*????????*/
.tab_m_area {width:100%; margin:0 auto; margin-bottom:20px; }
.tab_m_area .tab_m {width:590px; text-align:center; margin:0 auto; overflow:auto; }
.tab_m_area .tab_m li{margin-right:50px; float:left;}
.tab_m_area .tab_m li.last{margin-right:0px;}
.tab_m_area .tab_m li a{width:100%; display:inline-block; font-size:18px; letter-space:-1px;}
.tab_m_area .tab_m li a:hover{color:#005748;}
.tab_m_area .tab_m li a.on{color:#005748; font-weight:bold;}

@media screen and (max-width:759px) {

.tab_m_area {display:none;}

}