/* mobile */ body.mob .container {padding-top: 90px;} /* section */ section {position: relative; background-position: center center; background-repeat: no-repeat;} /* main */ section.ms {} section.ms .bg {} section.ms .bg > div {position: absolute; top: 0; left: 0; width: 100%; background-position: center center; background-repeat: no-repeat;} section.ms .txt {position: absolute; top: 0; text-align: left;} section.ms .txt .subject {margin-left: -5px; font-weight: 900; letter-spacing: -2px;} section.ms .txt .desc {line-height: 1.6em; opacity: 0.5;} section.ms .button {font-size: 0;} section.ms .button .btn {font-weight: 500; text-align: center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} section.ms01, section.ms01 .bg > div {height: 529px;} section.ms01 .txt {top: 125px; right: 0;} section.ms01 .txt .subject {position: relative; margin-bottom: 25px; padding-bottom: 30px; font-size: 40px; color: #1a1919;} section.ms01 .txt .subject:after {display: block; content: ""; position: absolute; left: 5px; bottom: 0; width: 28px; height: 4px; background-color: #706f6f;} section.ms01 .txt .desc {font-size: 18px; color: #1a1919; font-weight: 500;} section.ms01 .button {margin-top: 65px;} section.ms01 .button .btn {padding: 0 25px; background-color: #252525;} section.ms01 .button .btn:hover {background-color: #000;} section.ms01 .button .btn span {padding-right: 60px; line-height: 50px; font-size: 18px; color: #fff; background: url(../img/main/icnMoreView.png) right center no-repeat; letter-spacing: -0.5px;} section.ms02, section.ms02 .bg > div {height: 350px;} section.ms02 .txt {top: 90px; left: 0;} section.ms02 .txt .subject {font-size: 28px; color: #fff;} section.ms02 .txt .desc {margin-bottom: 20px; font-size: 16px; color: #fff; font-weight: bold;} section.ms02 .button {margin-top: 35px;} section.ms02 .button .btn {padding: 0 5px; width: 154px; line-height: 46px; font-size: 16px; color: #9a8579; background-color: #fff;} section.ms02 .button .btn:hover {color: #613411;} section.ms02 .button .btn.brown {color: #dbb191; background-color: #723d23;} section.ms02 .button .btn.brown:hover {color: #ffd5b2;} /* main - mobile */ body.mob section.ms {height: auto;} body.mob section.ms .bg > div {position: relative;} body.mob section.ms .cen {width: 100%;} body.mob section.ms .txt {text-align: center;} body.mob section.ms .txt .subject {margin-left: 0;} body.mob section.ms01 .txt {position: relative; top: 0; padding: 50px 30px 60px;} body.mob section.ms01 .txt .subject {padding-bottom: 0;} body.mob section.ms01 .txt .subject:after {display: none;} body.mob section.ms02 .cen {position: absolute; top: 0; left: 0;} body.mob section.ms02 .txt {top: 440px; padding: 0 30px; width: 100%;} /* sub */ /* cover */ .cover {height: 301px; background: url(../img/sub/imgCover.png) center center no-repeat; text-align: center;} .cover.cv00 {background-image: url(../img/sub/imgCover00.png)} .cover .txt {padding-top: 85px;} .cover .txt .subject {position: relative; margin-bottom: 20px; padding-bottom: 20px; line-height: 1.2em; font-size: 40px; color: #fff; font-weight: 900;} .cover .txt .subject:after {display: block; content: ""; position: absolute; bottom: 0; left: 50%; margin-left: -15px; width: 30px; height: 4px; background-color: rgba(255, 255, 255, 0.5); filter: progid:DXImageTransform.Microsoft.gradient( startColorStr=#80ffffff, endColorStr=#80ffffff ); -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorStr=#80ffffff, endColorStr=#80ffffff )";} .cover .txt .desc, .cover .txt .desc span {font-size: 16px; color: #fff; font-weight: 300; letter-spacing: -0.5px; opacity: 0.5;} .cover .txt .desc span + span {margin-left: 10px;} /* location */ .location {margin-top: -60px;} .location .cen {font-size: 0; background-color: #ba9275;} .location .home {display: inline-block; width: 60px; height: 60px; background: url(../img/sub/icnLocationHome.png) center center no-repeat; vertical-align: top;} .location .dep {display: inline-block; position: relative; border-left: 1px solid #c8a891; border-right: 1px solid #c8a891; vertical-align: top;} .location .dep .active {padding: 0 35px 0 20px; width: 188px; line-height: 60px; font-size: 16px; color: #fff; background: url(../img/sub/icnLocationSelect.png) 90% center no-repeat;} .location .dep ul {display: none; position: absolute; top: 100%; left: 0; z-index: 5; padding: 15px 0 20px; width: 100%; background-color: #ba9275; border-top: 1px solid #c8a891;} .location .dep ul.on {display: block;} .location .dep ul li {} .location .dep ul li a {display: block; padding: 0 20px; line-height: 35px; font-size: 16px; color: #fff; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} .location .dep ul li a:hover {opacity: 0.5;} /* post */ section.post {padding: 100px 0;} section.post .div {position: relative;} section.post .div + .div {margin-top: 100px;} section.post .head {margin-bottom: 40px; text-align: center;} section.post .head .title {font-size: 16px; color: #a7a7a7; font-weight: 500; letter-spacing: -0.5px;} section.post .head .title .dm {display: inline-block; line-height: 1.2em; font-size: 35px; color: #17100f; vertical-align: top;} section.post .head.tal {padding-top: 50px;} section.post .head.tal .title .dm {position: relative; background-color: #fff;} section.post .head.tal .title .dm:after {display: block; content: ""; position: absolute; top: 25px; left: 100%; margin-left: 10px; width: 205px; height: 1px; background-color: #d9d9d9;} /* our - mobile */ body.mob section.post .head {padding-top: 0 !important; text-align: center !important;} body.mob section.post .head .dm:after {display: none !important;} /* our */ section.post .our {padding: 40px 0; background-position: center center; background-repeat: no-repeat; text-align: right;} section.post .our .slide {display: inline-block; position: relative; padding: 30px 40px; width: 650px; height: 343px; background-color: rgba(255, 255, 255, 0.9); filter: progid:DXImageTransform.Microsoft.gradient( startColorStr=#e6ffffff, endColorStr=#e6ffffff ); -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorStr=#e6ffffff, endColorStr=#e6ffffff )"; text-align: left; vertical-align: top;} section.post .our .counter, section.post .our .counter .current {font-family: 'Roboto', sans-serif; color: #c3c2c2; letter-spacing: 1px;} section.post .our .counter {position: absolute; left: 40px; top: 35px; font-size: 14px; font-weight: 300; border-bottom: 1px solid #c3c2c2;} section.post .our .counter .current {display: inline-block; line-height: 1em; font-size: 18px; font-weight: bold; vertical-align: top;} section.post .our .list {padding-top: 55px;} section.post .our .list .item {} section.post .our .list .txt {} section.post .our .list .txt .subject {margin-bottom: 15px; font-size: 24px; color: #17100f; font-weight: 800;} section.post .our .list .txt ul {} section.post .our .list .txt ul li {font-size: 16px; font-weight: 500; opacity: 0.7;} section.post .our .list .txt ul li + li {margin-top: 5px;} section.post .our .bx-wrapper .bx-pager {display: none;} section.post .our .bx-wrapper .bx-controls-direction {position: absolute; top: 0; right: 0;} section.post .our .bx-wrapper .bx-controls-direction a {position: relative; top: 0; margin-top: 0; width: 30px; height: 28px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} section.post .our .bx-wrapper .bx-prev {left: 0; background: #9d9d9d url(../img/sub/icnSlidePrev.png) center center no-repeat;} section.post .our .bx-wrapper .bx-next {right: 0; margin-left: 1px; background: #9d9d9d url(../img/sub/icnSlideNext.png) center center no-repeat;} section.post .our .bx-wrapper .bx-prev:hover, section.post .our .bx-wrapper .bx-next:hover {background-color: #666;} /* our - mobile */ body.mob section.post .our {text-align: center;} body.mob section.post .our .slide {width: 600px;} /* customer */ section.post .customer {} section.post .customer .box {position: relative; padding: 60px 40px; width: 700px; background-color: #494d4c; z-index: 1;} section.post .customer .box .edge {padding: 50px 10px 55px; border: 1px solid #808382; text-align: center;} section.post .customer .box .edge ul {font-size: 0;} section.post .customer .box .edge ul li {display: inline-block; vertical-align: top;} section.post .customer .box .edge ul li + li {position: relative; margin-left: 40px; padding-left: 40px;} section.post .customer .box .edge ul li + li:before {display: block; content: ""; position: absolute; top: 50%; left: 0; margin-top: -12px; width: 1px; height: 24px; background-color: #6d7170;} section.post .customer .box .edge ul li > div {font-size: 28px; color: #fff;} section.post .customer .box .edge ul li .call {padding-left: 45px; background: url(../img/sub/icnCall.png) 0 center no-repeat;} section.post .customer .box .edge ul li .email {padding-left: 40px; background: url(../img/sub/icnEmail.png) 0 center no-repeat;} section.post .customer .box .desc {margin: 45px 0; font-size: 16px; color: #fff; opacity: 0.5; text-align: center;} section.post .customer .box .button {} section.post .customer .box .button .btn {display: block; line-height: 46px; font-size: 16px; color: #797775; font-weight: bold; background-color: #f7f1ec; text-align: center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} section.post .customer .box .button .btn + .btn {margin: 10px 0 0;} section.post .customer .box .button .btn:hover {color: #666; background-color: #fff;} section.post .customer .image {position: absolute; top: 0; right: 0;} /* customer - mobile */ body.mob section.post .customer .box {width: 100%;} body.mob section.post .customer .image {display: none;} /* board */ section.post .board {} section.post .board + .board {margin-top: 70px; padding-top: 40px; border-top: 1px solid #ededed;} /* board head */ section.post .board_head, section.post .board_head.flt2 > div {font-size: 0;} section.post .board_head {position: relative; margin-bottom: 20px;} section.post .board_head .subject {display: inline-block; line-height: 54px; font-size: 25px; color: #17100f; vertical-align: top;} section.post .board_head .subject.myjo {font-weight: 800;} section.post .board_head .chkB {margin: 16px 15px; height: 22px;} section.post .board_head .chkB input {width: 22px !important; height: 22px;} section.post .board_head .chkB input + label {padding-left: 30px !important; height: 22px; line-height: 22px; color: #666;} section.post .board_head .chkB input + label span {font-size: 16px; color: #999;} section.post .board_head select {padding-left: 20px; width: 253px; height: 54px; line-height: 1em; font-size: 18px; color: #666; background: #fff url(../img/common/icnBoardSelect.png) 92% center no-repeat; border-color: #e1e1e1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; outline: none;} section.post .board_head select:focus {border-color: #17100f;} section.post .board_head .btn {padding: 0 5px; min-width: 92px; line-height: 22px; font-size: 14px; color: #fff; background-color: #c2c2c2; text-align: center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} section.post .board_head .btn:hover {background-color: #666;} section.post .board_head .btn.black {background-color: #17100f;} section.post .board_head .lt .btn {margin: 16px 5px;} section.post .board_head .rt .btn {margin-right: 10px; padding: 0 10px; min-width: 130px; line-height: 54px; font-size: 18px;} /* board head - mobile */ body.mob section.post .board_head .subject {display: block; line-height: 27px;} body.mob section.post .board_head .chkB {margin: 5px 0 0;} /* board search */ section.post .board_search {position: relative; margin-bottom: 60px;} section.post .board_search input {padding: 0 75px 0 20px; width: 100%; height: 54px; font-size: 18px; border: 2px solid #ebebeb; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; outline: none;} section.post .board_search input:focus {border-color: #666;} section.post .board_search .btn {position: absolute; top: 0; right: 0; width: 67px; height: 54px; background: #17100f url(../img/common/icnBoardSearch.png) center center no-repeat; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; z-index: 5;} /* board ctrl */ section.post .board_ctrl {margin-top: 50px; font-size: 0; text-align: center;} section.post .board_ctrl a {margin: 0 2px; width: 33px; height: 33px; line-height: 31px; font-family: 'Noto', sans-serif; font-size: 16px; color: #666; border: 1px solid #ddd; text-align: center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} section.post .board_ctrl a:hover {border-color: #666;} section.post .board_ctrl a.on {color: #333d49;} section.post .board_ctrl a.prev {background: url(../img/common/icnBoardPrev.png) center center no-repeat;} section.post .board_ctrl a.next {background: url(../img/common/icnBoardNext.png) center center no-repeat;} /* board list */ section.post .board_list {} section.post .board_list table {border-top: 2px solid #080808; text-align: center;} section.post .board_list table thead {} section.post .board_list table tbody {} section.post .board_list table tr {} section.post .board_list table tr th, section.post .board_list table tr td {line-height: 1.2em; font-size: 15px; border-bottom: 1px solid #ededed;} section.post .board_list table tr th {padding: 20px 5px; color: #333d49; font-weight: 500; background-color: #f8f8f8;} section.post .board_list table tr td {padding: 15px 5px; color: #666;} section.post .board_list table tr td.color {color: #dc7f56;} section.post .board_list table tr td.blue {color: #5976a7;} section.post .board_list table tr td .btn {padding: 4px 5px; width: 92px; max-width: 100%; line-height: 22px; font-size: 15px; color: #fff; background-color: #c2c2c2; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-align: center; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;} section.post .board_list table tr td .btn:hover {background-color: #666;} section.post .board_list table tr td .btn.black {background-color: #17100f;} /* board head - mobile */ body.mob section.post .board_list {overflow-x: scroll;} body.mob section.post .board_list table {width: 200%;} /* contract */ section.contract .div + .div {margin-top: 75px;} section.contract .head {text-align: left;} section.contract .head .title {line-height: 1.2em; font-size: 35px; color: #17100f; font-weight: 800;} section.contract .info {} section.contract .info ul {margin: 0 -40px -40px 0;} section.contract .info ul li {margin: 0 40px 40px 0; width: 680px;} section.contract .info table {border-top: 2px solid #080808;} section.contract .info table thead {} section.contract .info table tbody {} section.contract .info table tr {} section.contract .info table tr th, section.contract .info table tr td {padding: 20px; line-height: 1.2em; border-bottom: 1px solid #ededed; border-left: 1px solid #ededed;} section.contract .info table tr th {font-size: 18px; color: #666; font-weight: 500; background-color: #f8f8f8;} section.contract .info table tr th.name {font-size: 25px; color: #17100f; background-color: #fff; border-left: 0; text-align: center; letter-spacing: -0.5px;} section.contract .info table tr th.name.myjo {font-weight: 800;} section.contract .info table tr td, section.contract .info table tr td em {font-size: 20px; font-weight: bold;} section.contract .info table tr td.color {color: #dc7f56;} section.contract .sum {} section.contract .sum ul {} section.contract .sum ul li {margin-left: 37px; width: 442px;} section.contract .sum ul li dl {padding: 135px 20px 20px; height: 253px; border: 2px solid #ebebeb; text-align: center;} section.contract .sum ul li.i01 dl {background: url(../img/sub/icnContractinfo01.png) center 43px no-repeat;} section.contract .sum ul li.i02 dl {background: url(../img/sub/icnContractinfo02.png) center 43px no-repeat;} section.contract .sum ul li.i03 dl {background: url(../img/sub/icnContractinfo03.png) center 54px no-repeat;} section.contract .sum ul li dl dt {margin-bottom: 5px; font-size: 24px; color: #666; font-weight: 500;} section.contract .sum ul li dl dd, section.contract .sum ul li dl dd em {font-size: 26px; font-weight: bold;} section.contract .sum ul li dl dd.color {color: #dc7f56;} /* contract - mobile */ body.mob section.contract .info ul {margin-right: 0;} body.mob section.contract .info ul li {margin-right: 0; width: 100%;} body.mob section.contract .sum ul li {margin-left: 15px; width: 210px;}