@charset "utf-8";
/* Àüü ·¹À̾ƿô */
#container {position:relative; top:70px; margin-left:430px; margin-bottom:50px; max-width:1200px; background:#fff}
/* ·ÎÄÉÀÌ¼Ç ¿µ¿ª */
#container .location_bar {height:60px}
#container .location_bar {max-width:1150px; padding:0 0 0 50px}
#container .location_bar ul {border-bottom:1px solid #ccc}
#container .location_bar ul li {display:inline-block; color:#888; line-height:60px}
#container .location_bar ul li.divider {margin:0 5px}
#container .location_bar ul li.current {color:#333}
/* ÄÁÅÙÃ÷ ¿µ¿ª ·¹À̾ƿô */
#container > .inner {padding:50px}
#container > .inner:after {clear:both; display:block; content:''}
/* ¿ìÃø ¹è³Ê ¿µ¿ª */
#aside {position:fixed; top:0; right:0; width:200px; height:100%; z-index:100}
#aside > .item {position:relative; height:25%; text-align:center}
#aside > .item > a {display:block; padding:40px 30px; height:100%}
#aside > .item .icon {width:35%; margin:0 auto 15px auto}
#aside > .item .icon img {display:inline-block; width:100%}
#aside > .info {position:absolute; bottom:40px; left:0; width:100%}
#aside > .item span {font-size:11px; color:#777}
#aside > .item h3 {font-size:16px; font-weight:600; color:#666; margin:5px 0 10px 0}
#aside > .item p {font-size:12px; color:#7a7a7a; line-height:1.3; letter-spacing:-0.5px}
#aside > .item.color1 {background:#f4f4f4}
#aside > .item.color2 {background:#666}
#aside > .item.color2 span, #aside > .item.color2 h3, #aside > .item.color2 p {color:#fff}
#aside > .item.color3 {background:#444}
#aside > .item.color3 span, #aside > .item.color3 h3, #aside > .item.color3 p {color:#fff}
/* ÄÁÅÙÃ÷ ³»ºÎ °øÅë */
#container > .inner img.img_tab, #container > .inner img.img_mob {display:none !important}
#container > .inner .title {margin-bottom:40px}
#container > .inner .title h2 {font-size:35px; font-weight:600; color:#333; line-height:1.2; margin-bottom:15px}
#container > .inner .title p {font-size:12px; color:#888; line-height:1.6}
#container > .inner h3.sub_tit {font-size:22px; font-weight:400; line-height:1.2; color:#ca2600; margin-bottom:10px}
#container > .inner img {display:block; width:100%;}
#container > .inner p span {color:#ca2600; font-weight:bold; font-size:18px}
#container > .inner .txtbox {padding:15px; margin:10px 0; background: #f1f1f1}
.scroll {overflow:auto}
table {
width:100%;
border-collapse: collapse;
border-spacing: 0;
}
.business table th {
font-weight: 500;
font-size: 16px;
color: #252525;
background-color: #c0d4f9;
}
.table_data th, .table_price th {
border-right: 1px solid #e9ebf0;
}
.table_data th:last-child, .table_data td:last-of-type, .table_price th:last-child, .table_price  td:last-of-type{
border-right: none;
}
.table_data td {text-align:left}
.business table td {
font-size: 15px;
text-align: center;
color: #666;
border-bottom: 1px solid #e9ebf0;
border-right: 1px solid #e9ebf0;
}
.business table th, td {
padding: 16px 30px;
line-height: 1.65;
letter-spacing: -0.075em;
}
.table_list th {
border-bottom: 1px solid #e9ebf0;
text-align: center;
}
.table_list th:first-child, .table_list td:nth-of-type(1) {
border-top: 1px solid #e9ebf0;
}
.table_list td:first-child {
font-weight:bold;
color:#2e3192
}
.table_list td:last-child{
border-bottom: 1px solid #e9ebf0;
}
.pt20 {padding-top:20px !important}
.mt20 {margin-top:20px !important}
/* COMPANY - ȸ»ç¼Ò°³ */
#container > .inner .greeting .grt_tit {margin-bottom:60px}
#container > .inner .greeting .grt_tit h3 {font-size:22px; font-weight:600; color:#444; line-height:1.2; margin-bottom:20px}
#container > .inner .greeting ul.teamList {text-align:justify; margin-bottom:60px}
#container > .inner .greeting ul.teamList:after {display:inline-block; width:100%; content:''}
#container > .inner .greeting ul.teamList > li {display:inline-block; width:30%; vertical-align:top}
#container > .inner .greeting ul.teamList > li .info {margin-bottom:30px}
#container > .inner .greeting ul.teamList > li .info h4 {font-size:18px; font-weight:600; color:#555; line-height:1.1}
#container > .inner .greeting ul.teamList > li .info span {font-size:12px; color:#888}
#container > .inner .greeting ul.teamList > li .info ul {margin-top:20px}
#container > .inner .greeting ul.teamList > li .info ul li {color:#666}
#container > .inner .greeting ul.teamList > li .info ul li:before {display:inline-block; width:2px; height:2px; content:''; margin-right:5px; background:#ccc; vertical-align:middle}
#container > .inner .greeting ul.teamList > li .imgArea {width:80%; margin:0 auto; border-radius:50%; overflow:hidden}
#container > .inner .greeting .info_box {margin-top:30px}
#container > .inner .greeting .info_box dl {margin:0; overflow:hidden}
#container > .inner .greeting .info_box dl dt {display:block; float:left; width:12%; padding:8px 0; font-weight:600; color:#444; border-bottom:1px dotted #ccc}
#container > .inner .greeting .info_box dl dd {display:block; margin-left:15%; padding:8px 0; color:#666; border-bottom:1px dotted #ccc}
/* COMPANY - ¿¬Çõ */
#container > .inner .history .history_box {margin-bottom:60px}
#container > .inner .history .history_box:after {clear:both; display:block; content:''}
#container > .inner .history .history_box .his_tit {margin-bottom:30px; padding-bottom:15px; border-bottom:2px solid #aaa}
#container > .inner .history .history_box .his_tit span {font-size:20px; color:#888}
#container > .inner .history .history_box .his_tit h3 {font-size:24px; font-weight:600; color:#444; line-height:1}
#container > .inner .history .history_box .left {float:left; width:45%}
#container > .inner .history .history_box .left p {color:#666; margin-bottom:25px; text-align:justify}
#container > .inner .history .history_box .right {float:right; width:50%}
#container > .inner .history .history_box .right dl {clear:both; margin:0 0 20px 0; overflow:hidden}
#container > .inner .history .history_box .right dl dt {float:left; width:60px; font-size:24px; font-weight:600; color:#444}
#container > .inner .history .history_box .right dl dd {margin-left:80px; line-height:2; color:#666}
/* COMPANY - ã¾Æ¿À½Ã´Â ±æ */
#map {position:relative; height:400px; margin-bottom:30px; overflow:hidden}
#container > .inner .map_box {padding:30px; background:#f6f6f6; overflow:hidden; clear:both}
#container > .inner .map_box .fl {float:left; width:48%; padding:1%}
#container > .inner .map_box ul.map_info li {color:#666}
#container > .inner .map_box ul.map_info li:before {display:inline-block; width:3px; height:3px; margin-right:5px; content:''; background:#aaa; vertical-align:4px}
/* BUSINESS - »ç¾÷¾È³» */
#container > .inner .business ul.typeList {text-align:justify; margin-bottom:60px}
#container > .inner .business ul.typeList:after {display:inline-block; width:100%; content:''}
#container > .inner .business ul.typeList li {display:inline-block; width:23%; vertical-align:top}
#container > .inner .business ul.typeList .imgArea {margin-bottom:25px; overflow:hidden}
#container > .inner .business ul.typeList .info h4 {font-size:18px; font-weight:400; color:#444; line-height:1; margin-bottom:15px}
#container > .inner .business ul.typeList .info p {color:#666}
#container > .inner .business ul.processList {text-align:justify; margin-bottom:60px}
#container > .inner .business ul.processList:after {display:inline-block; width:100%; content:''}
#container > .inner .business ul.processList li {display:inline-block; width:31%}
#container > .inner .business ul.processList .imgArea {margin-bottom:20px; overflow:hidden}
#container > .inner .business ul.processList .info {padding:10px 15px; background:#ebebeb}
#container > .inner .business ul.processList .info.color {background:#555}
#container > .inner .business ul.processList .info.color span {color:#fff}
#container > .inner .business ul.processList .info span {font-size:15px; color:#777}
/* BUSINESS - »ç¾÷¿µ¿ª */
#container > .inner .business .area_wrap {text-align:justify; overflow:hidden}
#container > .inner .business .area_wrap:after {display:inline-block; width:100%; content:''}
#container > .inner .business .area_wrap > .area_box {display:inline-block; width:49.5%; margin-bottom:20px; vertical-align:top}
#container > .inner .business .area_wrap > .area_box .imgArea {overflow:hidden}
#container > .inner .business .area_wrap > .area_box .info {padding:30px; min-height:260px; background:#efefef}
#container > .inner .business .area_wrap > .area_box .info h4 {font-size:24px; font-weight:400; color:#444; line-height:1; margin-bottom:40px}
/* ¹Ìµð¾î Äõ¸® */
@media screen and (max-width:1366px) {
/* ¼­ºê °øÅë ·¹À̾ƿô */
#container {top:0; margin-left:200px}
}
@media screen and (max-width:1024px) {
/* ¼­ºê °øÅë ·¹À̾ƿô */
#container {margin:0; top:0}
#container .location_bar {display:none}
/* COMPANY - ȸ»ç¼Ò°³ */
#container > .inner .greeting .grt_tit p br {display:none}
#container > .inner .greeting ul.teamList > li .info ul li {font-size:12px}
#container > .inner .greeting ul.teamList > li .info span {font-size:11px}
#container > .inner .greeting ul.teamList > li .imgArea {width:70%}
/* BUSINESS - »ç¾÷¾È³» */
#container > .inner .business > p br {display:none}
#container > .inner .business ul.typeList li {width:48%; margin-bottom:40px}
#container > .inner .business ul.typeList li .imgArea {max-height:250px}
#container > .inner .business ul.typeList li .imgArea img {margin-top:-20%}
#container > .inner .business ul.processList .info span {font-size:13px}
/* BUSINESS - »ç¾÷¿µ¿ª */
#container > .inner .business .area_wrap > .area_box .info {min-height:280px}
}
@media screen and (max-width:768px) {
/* ¼­ºê °øÅë ·¹À̾ƿô */
#container > .inner {padding:30px 30px 50px 30px}
#container > .inner .title h2 {font-size:24px}
#container > .inner h3.sub_tit {font-size:16px; font-weight:600}
#container > .inner img.img_mob {display:block !important}
#container > .inner img.img_pc {display:none !important}
#container > .inner .map_box .fl {width:100%}
/* COMPANY - ȸ»ç¼Ò°³ */
#container > .inner .greeting .grt_tit h3 {font-size:16px}
#container > .inner .greeting ul.teamList > li {width:100%; margin-bottom:30px; padding-top:30px; text-align:center; border-top:1px solid #e6e6e6}
#container > .inner .greeting ul.teamList > li:first-child {border-top:none}
#container > .inner .greeting ul.teamList > li .imgArea {width:160px}
#container > .inner .greeting .info_box dl {border-bottom:1px dotted #ccc}
#container > .inner .greeting .info_box dl dt {width:20%; border:none}
#container > .inner .greeting .info_box dl dd {margin-left:25%; border:none}
/* COMPANY - ¿¬Çõ */
#container > .inner .history .history_box .his_tit span {font-size:14px}
#container > .inner .history .history_box .his_tit h3 {font-size:18px; margin-top:5px}
#container > .inner .history .history_box .left {float:none; width:100%; margin-bottom:40px}
#container > .inner .history .history_box .left p {font-size:12px}
#container > .inner .history .history_box .right {margin-left:none; width:100%}
#container > .inner .history .history_box .right dl {margin:15px 0; padding:15px 0 0 0; border-top:1px solid #e6e6e6}
#container > .inner .history .history_box .right dl:first-child {border-top:none}
#container > .inner .history .history_box .right dl dt {width:45px; font-size:18px}
#container > .inner .history .history_box .right dl dd {margin-left:60px; font-size:12px}
/* COMPANY - ã¾Æ¿À½Ã´Â ±æ */
#map {height:350px}
#container > .inner .map_box ul.map_info li {font-size:12px}
/* BUSINESS - »ç¾÷¾È³» */
#container > .inner .business ul.typeList li {width:100%}
#container > .inner .business ul.typeList .info h4 {font-size:15px}
#container > .inner .business ul.typeList li .imgArea {max-height:initial}
#container > .inner .business ul.typeList li .imgArea img {margin-top:0}
#container > .inner .business ul.processList li {width:100%; margin-bottom:40px}
#container > .inner .business ul.processList li:last-child {margin-bottom:0}
/* BUSINESS - »ç¾÷¿µ¿ª */
#container > .inner .business .area_wrap > .area_box {width:100%; margin-bottom:15px}
#container > .inner .business .area_wrap > .area_box .info {min-height:initial; padding:20px}
#container > .inner .business .area_wrap > .area_box .info h4 {font-size:15px; font-weight:600; margin-bottom:20px}
#container > .inner .business .area_wrap > .area_box .info p {font-size:12px}
}
/* °´½Ç¹Ì¸®º¸±â */
.view_room {
width: 100%;
overflow: hidden;
padding: 2.5% 3% 3% 3%;
background: #f1f1f1;
margin: 1% 0 3% 0;
}
.view_room .img_big {
width: 78%;
float: left;
}
.view_room .img_big img {
width: 100%;
height: auto;
}
.view_room .img_small {
width: 20%;
overflow: hidden;
float: right;
}
.view_room .img_small ul {
float: right;
}
.view_room .img_small ul li {
width: 48%;
float: left;
text-align: right;
line-height: 0;
margin: 0 0 1% 1%;
}
.view_room .img_small ul li img {
width: 100%;
height: auto;
}


/* ÀÌ¿ë¾È³» */
.gallery {width:100%; background:#f1f1f1; overflow:hidden; padding:2%; margin:0 0 3% 0}
.gallery ul li{float:left; width:31.3%; margin:1%}


/* ¿ä±Ý¾È³» */
.fbox dl {
width: 100%;
overflow: hidden;
margin: 0
}
.fbox dl.tit dt {
background: #323232;
}
.fbox dl dt {
width: 22%;
float: left;
background: #454545;
color: #fff;
margin: 0 0 1px 0;
text-align: center;
padding: 10px 0;
}
.fbox dl.tit dd {
background: #999;
color: #fff;
}
.fbox dl dd {
width: 25.8%;
float: left;
background: #e1e1e1;
color: #323232;
margin: 0 0 1px 1px;
text-align: center;
padding: 10px 0;
}
.fbox dl dt, .fbox dl dd {
font-family: ''Work Sans','notokr'';
}
@media screen and (max-height:768px) {
#aside > .item p.desc {display:none}
.business table th, td {padding:0}
}
@media screen and (max-width:480px) {
.view_room .img_big {display:none}
.view_room .img_small {width:100%}
.view_room .img_small ul li {width:100%}
.gallery ul li{width:100%;}
}