@import url("reset.css");

.main {width:100%; box-sizing:border-box; padding:100px 0 0 0; position:relative;}
.main > .inner {width:100%; box-sizing:border-box;}

.main .main-title {width:95%; height:135px; margin:60px auto; font-size:0; background:url(/img/main/main_logo.png) center no-repeat; background-size:auto 100%;}

.main .visual {width:95%; max-width:1600px; height:810px; margin:0 auto; position:relative;}
.main .visual .visual-slide {width:100%;}
.main .visual .visual-slide .visual-box {width:100%; height:810px; position:relative;}
.main .visual .visual-slide .visual-box .visual-bg {width:100%; height:100%; position:absolute; left:0; top:0; z-index:0;}
.main .visual .visual-slide .visual-box .visual-bg img {max-width:100%; max-height:100%; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%);}
.main .visual .visual-slide .visual-box .txt-box {width:100%; box-sizing:border-box; padding:100px 0 0 100px; font-size:74px; line-height:1.4; font-weight:700; letter-spacing:-2px; color:#fff; position:absolute; left:0; top:0; z-index:1;}

.main .video {width:100%; margin:180px 0 300px 0;}
.main .video > .inner {width:95%; max-width:1600px; margin:0 auto;}
.main .video .txt-box {width:100%; font-size:24px; line-height:1.4; font-weight:400; word-wrap:break-word; word-break:keep-all; color:#666; text-align:center; margin-bottom:150px;}
.main .video .video-area {width:100%; font-size:0;}
.main .video .video-area .video-box {display:inline-block; vertical-align:top; margin-left:100px; width:calc(((100% - 100px) / 2) - 1px); position:relative;}
.main .video .video-area .video-box:nth-child(1) {margin-left:0;}
.main .video .video-area .video-box .video-inner {width:100%; height:0; padding-bottom:calc(385 / 750 * 100%); background:#000; cursor:pointer; position:relative; -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.5); box-shadow: 0px 10px 30px 0px rgba(0,0,0,0.5);}
.main .video .video-area .video-box .video-inner:after {content:""; width:0; height:0; border:solid transparent; border-width:25px 0; border-left:44px solid #c0a75d; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:11;}
.main .video .video-area .video-box .video-inner .cover {width:100%; height:100%; position:absolute; left:0; top:0; z-index:6; overflow:hidden;}
.main .video .video-area .video-box .video-inner .cover:before {content:""; width:105%; height:105%; background:rgba(0,0,0,1); position:absolute; left:0; top:0; z-index:5;}
.main .video .video-area .video-box .video-inner .cover img {max-width:100%; max-height:100%; position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%); z-index:6}
.main .video .video-area .video-box .video-inner video,
.main .video .video-area .video-box .video-inner iframe {width:100%; height:100%; position:absolute; left:0; top:0; z-index:5;}
.main .video .video-area .video-box .video-title {width:100%; margin-top:60px;}
.main .video .video-area .video-box .video-title h1 {font-size:48px; text-align:center; margin-bottom:20px; letter-spacing:-1.5px;}
.main .video .video-area .video-box .video-title h2 {font-size:30px; text-align:center; color:#666;}

.main .history {width:100%; box-sizing:border-box; background:#f3eee8; padding:0 0 200px 0; position:relative;}
.main .history:before {content:""; width:100%; height:140px; background:#fff; position:absolute; left:0; top:0; z-index:0;}
.main .history:after {content:""; width:100%; height:964px; background:url(/img/main/history_bg.png) right center no-repeat; background-size:auto 100%; position:absolute; right:0; top:50%; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); z-index:0;}
.main .history > .inner {width:100%; position:relative; z-index:10;}
.main .history .cont {width:100%; max-width:1600px; font-size:0; margin:0 auto; box-sizing:border-box; position:relative; padding:0 2.5%;}
.main .history .cont > * {display:inline-block; vertical-align:top; box-sizing:border-box; width:50%; text-align:left; position:relative;}
.main .history .cont .title {padding:0 30px; font-family: 'Garamond'; font-size:265px; font-weight:400; letter-spacing:-5px;}
.main .history .cont .img-box .img img {max-width:100%; display:block;}
.main .history .cont .img-box .img-01 {position:relative; z-index:10; width:38%; max-width:304px;}
.main .history .cont .img-box .img-02 {position:absolute; right:0; bottom:-60%; z-index:9; width:70%; max-width:559px;}
.main .history .cont .txt-box {padding:30px 0 0 150px; position:relative;}
.main .history .cont .txt-box .tlt {writing-mode:vertical-lr; font-family: 'Garamond'; font-size:0; position:absolute; left:0; top:30px;}
.main .history .cont .txt-box .tlt > * {display:inline-block; vertical-align:middle; font-size:30px; letter-spacing:2px; margin-bottom:45px;}
.main .history .cont .txt-box .tlt > *:last-child {margin-bottom:0;}
.main .history .cont .txt-box .tlt span {font-family: 'Lucida Bright'; font-style:italic; letter-spacing:0; font-size:30px;}
.main .history .cont .txt-box h1 {font-size:36px; line-height:1.4; font-weight:500; letter-spacing:-2px; word-wrap:break-word; word-break:keep-all;}
.main .history .cont .txt-box .txt {margin-top:75px; font-size:20px; line-height:1.8; letter-spacing:-1.2px; word-wrap:break-word; word-break:keep-all; color:#645E57;}
.main .history .slide-area {width:100%; max-width:1920px; margin:0 auto; margin-top:300px; overflow:hidden;}
.main .history .slide-area ul.history-slide li .img img {max-width:100%; display:block; margin:0 auto;}
.main .history .slide-area .slick-list {margin:0 -50px;}
.main .history .slide-area .slick-slide {margin:0 50px;}
.main .history .counter-area {width:100%; font-size:0; margin-top:250px; box-sizing:border-box; padding:0 2.5%;}
.main .history .counter-area h1 {font-size:42px; font-weight:700; letter-spacing:-1.5px; text-align:center; line-height:1.6; word-wrap:break-word; word-break:keep-all;}
.main .history .counter-area .counter-wrap {width:100%; font-size:0; text-align:center; margin:120px 0 0 0;}
.main .history .counter-area .counter-wrap .counter-box {display:inline-block; vertical-align:top; margin-left:100px; text-align:center; box-sizing:border-box;}
.main .history .counter-area .counter-wrap .counter-box:nth-child(1) {margin-left:0;}
.main .history .counter-area .counter-wrap .counter-box .counter {font-size:160px; color:#8C2232; letter-spacing:-2px; box-sizing:border-box; position:relative; display:inline-block; max-width:100%; margin-bottom:60px;}
.main .history .counter-area .counter-wrap .counter-box .counter:after {content:"+"; font-size:145px; font-weight:400; display:inline-block; vertical-align:bottom; padding-bottom:10px;}
.main .history .counter-area .counter-wrap .counter-box .counter span {font-family: 'Garamond';}
.main .history .counter-area .counter-wrap .counter-box .txt {font-size:24px; font-weight:500; color:#666; line-height:1.5; word-wrap:break-word; word-break:keep-all;}


.main .vision {width:100%; margin:230px 0;}
.main .vision > .inner {width:100%; max-width:1920px; margin:0 auto; box-sizing:border-box; position:relative;}
.main .vision .title-box {width:100%; box-sizing:border-box; padding:0 2.5%; text-align:center; z-index:10; position:relative;}
.main .vision .title-box h1 {font-family: 'Garamond'; font-size:265px; letter-spacing:-5px; text-align:center; margin-bottom:40px; margin-top:-30px;}
.main .vision .title-box .txt {font-size:36px; font-weight:300; line-height:1.4; word-wrap:break-word; word-break:keep-all;}
.main .vision .vision-area {width:100%; margin-top:150px; position:relative;}
.main .vision .vision-area .slide-arrow {width:95%; max-width:1600px; font-size:0; position:absolute; left:50%; top:420px; -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); transform:translateX(-50%); z-index:1;}
.main .vision .vision-area .slide-arrow > * {display:inline-block; vertical-align:middle; font-size:20px; color:#dedede; position:relative; margin-right:10px;}
.main .vision .vision-area .slide-arrow > *:last-child {margin-right:0;}
.main .vision .vision-area .slide-arrow .arrow {width:15px; height:20px; font-size:0; cursor:pointer;}
.main .vision .vision-area .slide-arrow .arrow:before {content:""; width:12px; height:12px; border:solid #dedede; border-width:1px 1px 0 0; position:absolute; top:4px;}
.main .vision .vision-area .slide-arrow .arrow.btn-prev:before {-webkit-transform:rotate(-135deg); -moz-transform:rotate(-135deg); transform:rotate(-135deg); left:2px;}
.main .vision .vision-area .slide-arrow .arrow.btn-next:before {-webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg); right:2px;}
.main .vision .vision-area .slide-arrow .arrow:hover:before,
.main .vision .vision-area .slide-arrow .arrow.mo:before,
.main .vision .vision-area .slide-arrow .arrow.mo:hover:before{border:solid #000; border-width:1px 1px 0 0;}
.main .vision .vision-area .slide-arrow .current {color:#000;}
.main .vision .vision-area .vision-wrap {width:100%;}
.main .vision .vision-area .vision-wrap .vision-slide {width:72%; max-width:1375px;}
.main .vision .vision-area .vision-wrap .vision-slide:nth-child(odd) {margin-left:auto;}
.main .vision .vision-area .vision-wrap .vision-slide:nth-child(even) {margin-right:auto;}
.main .vision .vision-area .vision-wrap .vision-slide .slick-slide {line-height:0;}
.main .vision .vision-area .vision-wrap .vision-box {width:100%; height:480px; display:table;}
.main .vision .vision-area .vision-wrap .vision-box.vision-1 {background:url(/img/main/vision_01.png) center no-repeat; background-size:auto 100%;}
.main .vision .vision-area .vision-wrap .vision-box.vision-2 {background:url(/img/main/vision_02.png) center no-repeat; background-size:auto 100%;}
.main .vision .vision-area .vision-wrap .vision-box.vision-3 {background:url(/img/main/vision_03.png) right center no-repeat; background-size:auto 100%;}
.main .vision .vision-area .vision-wrap .vision-box.vision-4 {background:url(/img/main/vision_04.png) center no-repeat; background-size:auto 100%;}
.main .vision .vision-area .vision-wrap .vision-box > .inner {width:100%; display:table-cell; vertical-align:middle; box-sizing:border-box; padding-right:150px;}
.main .vision .vision-area .vision-wrap .vision-box .txt-box {width:40%; margin-left:auto;}
.main .vision .vision-area .vision-wrap .vision-box .txt-box h1 {font-size:44px; font-weight:500; color:#fff; margin:20px 0; letter-spacing:-2px; transition-delay:0.3s; margin-bottom:60px;}
.main .vision .vision-area .vision-wrap .vision-box .txt-box h2 {font-size:32px; font-weight:500; color:#fff; transition-delay:0.2s;}
.main .vision .vision-area .vision-wrap .vision-box .txt-box .txt {font-size:24px; line-height:1.4; word-wrap:break-word; word-break:keep-all; color:#ddd; margin-bottom:60px; transition-delay:0.4s;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more {width:140px; height:50px; box-sizing:border-box; border:2px solid #fff; text-align:center; transition-delay:0.5s; overflow:hidden;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more:before {content:""; width:100%; height:100%; background:#fff; position:absolute; left:0; bottom:0; z-index:-1; opacity:0; -webkit-transform:scaleX(0); -moz-transform:scaleX(0); transform:scaleX(0); transition:transform .15s ease-in, opacity .15s ease-in;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more a {display:block; font-size:16px; font-weight:500; color:#fff; line-height:46px;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more:hover:before {opacity:1; -webkit-transform:scaleX(1); -moz-transform:scaleX(1); transform:scaleX(1); transition:transform .2s ease-out, opacity .2s ease-out;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more:hover a {color:#8c2232;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more.mo:before {opacity:1; -webkit-transform:scaleX(1); -moz-transform:scaleX(1); transform:scaleX(1); transition:transform .2s ease-out, opacity .2s ease-out; background:transparent;}
.main .vision .vision-area .vision-wrap .vision-box .btn-more.mo a {color:#fff;}
.main .vision .vision-area .tlt {width:95%; max-width:1600px; writing-mode:vertical-lr; font-family: 'Lucida Bright'; font-style:italic; letter-spacing:0; font-size:30px; position:absolute; left:50%; top:0; z-index:0; -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); transform:translateX(-50%);}


.main .coworker {width:100%; height:780px; box-sizing:border-box; padding:20px 0; display:table; background:url(/img/main/coworker_bg.png) center no-repeat; background-size:cover;}
.main .coworker > .inner {width:100%; display:table-cell; vertical-align:middle; box-sizing:border-box;}
.main .coworker .coworker-wrap {width:95%; max-width:1600px; margin:0 auto; text-align:right; color:#fff;}
.main .coworker .coworker-wrap .txt-box h1 {font-size:42px; font-weight:700; letter-spacing:-2px; line-height:1.4; margin-bottom:30px; color:#fff;}
.main .coworker .coworker-wrap .txt-box .txt {font-size:24px; font-weight:300; line-height:1.4; word-wrap:break-word; word-break:keep-all; transition-delay:0.1s;}
.main .coworker .coworker-wrap ul {text-align:right; margin:50px 0 70px 0; transition-delay:0.3s;}
.main .coworker .coworker-wrap ul li {display:inline-block; vertical-align:middle; margin-left:40px; position:relative;}
.main .coworker .coworker-wrap ul li:before {content:""; width:1px; height:70%; border-left:1px solid #C0A75D; position:absolute; left:-20px; top:calc(50% + 1px); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%);}
.main .coworker .coworker-wrap ul li:nth-child(1) {margin-left:0;}
.main .coworker .coworker-wrap ul li:nth-child(1):before {display:none;}
.main .coworker .coworker-wrap ul li a {display:block; font-size:30px; color:#C0A75D;}
.main .coworker .coworker-wrap .btn {width:160px; height:60px; border-radius:60px; box-sizing:border-box; display:inline-block; text-align:center; background:#C0A75D; border:2px solid #C0A75D; transition-delay:0.4s; overflow:hidden;}
.main .coworker .coworker-wrap .btn:before {content:""; width:100%; height:100%; background:#fff; position:absolute; left:0; bottom:0; opacity:0; z-index:-1; -webkit-transform:scaleX(0); -moz-transform:scaleX(0); transform:scaleX(0); transition:transform .15s ease-in, opacity .15s ease-in; border-radius:60px;}
.main .coworker .coworker-wrap .btn a {display:block; border-radius:60px; font-size:20px; font-weight:500; color:#fff; line-height:56px;}
.main .coworker .coworker-wrap .btn:hover:before {opacity:1; transition:transform .2s ease-in, opacity .2s ease-in; -webkit-transform:scaleX(1); -moz-transform:scaleX(1); transform:scaleX(1);}
.main .coworker .coworker-wrap .btn:hover a {color:#C0A75D;}
.main .coworker .coworker-wrap .btn.mo:before {opacity:1; transition:transform .2s ease-in, opacity .2s ease-in; -webkit-transform:scaleX(1); -moz-transform:scaleX(1); transform:scaleX(1); background:#C0A75D;}
.main .coworker .coworker-wrap .btn.mo a {color:#fff;}


.modal {position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); z-index:1000; width:90%; display:none;}
.modal .video-popup {width:100%; max-width:1280px; margin:0 auto;}
.modal .video-popup span {display:block; width:100%; height:0; padding-bottom:calc(720 / 1280 * 100%); position:relative; overflow:hidden;}
.modal .video-popup span iframe {width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.modal.active {display:block;}
.modal-bg {width:100%; height:100vh; position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); background:rgba(0,0,0,0.8); z-index:999;}



@media screen and (max-width: 1920px){
	/*.main .vision .vision-area .tlt {left:30px;}*/
}


@media screen and (max-width: 1600px){

	.main .history .counter-area .counter-wrap .counter-box {margin-left:60px;}
	.main .history .counter-area .counter-wrap .counter-box .counter {font-size:120px;}
	.main .history .counter-area .counter-wrap .counter-box .counter:after {font-size:95px;}

}


@media screen and (max-width: 1280px){

	.main .visual {height:730px;}
	.main .visual .visual-slide .visual-box .visual-bg {height:730px;}
	.main .visual .visual-slide .visual-box .visual .txt-box {padding:80px 0 0 80px; font-size:65px;}

	.main .video {margin:160px 0 280px 0;}
	.main .video .txt-box {font-size:22px; margin-bottom:130px;}
	.main .video .video-area .video-box {margin-left:80px; width:calc(((100% - 80px) / 2) - 1px);}
	.main .video .video-area .video-box .video-inner:after {border-width:20px 0; border-left:34px solid #c0a75d;}
	.main .video .video-area .video-box .video-title {margin-top:50px;}
	.main .video .video-area .video-box .video-title h1 {font-size:36px;}
	.main .video .video-area .video-box .video-title h2 {font-size:26px;}

	.main .history {padding:0 0 180px 0;}
	.main .history:before {height:120px;}
	.main .history:after {height:650px;}
	.main .history .cont .title {padding:0 30px; font-size:220px;}

	.main .history .cont .txt-box {width:65%; padding:30px 0 0 100px;}
	.main .history .cont .txt-box .tlt {top:30px;}
	.main .history .cont .txt-box .tlt > * {font-size:26px; margin-bottom:40px;}
	.main .history .cont .txt-box .tlt span {font-size:26px;}
	.main .history .cont .txt-box h1 {font-size:32px; letter-spacing:-1.5px;}
	.main .history .cont .txt-box .txt {margin-top:65px; font-size:18px;}
	.main .history .slide-area {margin-top:200px;}
	.main .history .slide-area .slick-list {margin:0 -30px;}
	.main .history .slide-area .slick-slide {margin:0 30px;}
	.main .history .counter-area {margin-top:180px;}
	.main .history .counter-area h1 {font-size:35px;}
	.main .history .counter-area .counter-wrap {margin:100px 0 0 0;}
	.main .history .counter-area .counter-wrap .counter-box {margin-left:40px;}
	.main .history .counter-area .counter-wrap .counter-box .counter {font-size:110px; margin-bottom:40px;}
	.main .history .counter-area .counter-wrap .counter-box .counter:after { font-size:80px;}
	.main .history .counter-area .counter-wrap .counter-box .txt {font-size:18px;}

	.main .vision {margin:180px 0;}
	.main .vision .title-box h1 {font-size:220px; margin-bottom:30px;}
	.main .vision .title-box .txt {font-size:32px;}
	.main .vision .vision-area {margin-top:130px;}
	.main .vision .vision-area .slide-arrow {top:320px;}
	.main .vision .vision-area .vision-wrap .vision-box {height:380px;}
	.main .vision .vision-area .vision-wrap .vision-box > .inner {padding-right:50px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box {width:50%;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h1 {font-size:35px; margin:10px 0; letter-spacing:-1.5px; margin-bottom:50px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h2 {font-size:26px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box .txt {font-size:18px; margin-bottom:50px;}

	.main .coworker {height:680px;}
	.main .coworker .coworker-wrap .txt-box h1 {font-size:35px; letter-spacing:-1.5px; margin-bottom:30px;}
	.main .coworker .coworker-wrap .txt-box .txt {font-size:22px;}
	.main .coworker .coworker-wrap ul {margin:40px 0 60px 0;}
	.main .coworker .coworker-wrap ul li a {font-size:26px;}


}

@media screen and (max-width: 1024px){

	.main .main-title {height:120px; margin:50px auto;}

	.main .visual {height:580px;}
	.main .visual .visual-slide .visual-box .visual-bg {height:580px;}
	.main .visual .visual-slide .visual-box .txt-box {padding:60px 0 0 60px; font-size:50px;}

	.main .video {margin:120px 0 240px 0;}
	.main .video .txt-box {font-size:20px; margin-bottom:100px;}
	.main .video .video-area {width:90%; margin:0 auto; max-width:750px;}
	.main .video .video-area .video-box {margin-left:0; width:100%; max-width:750px; margin:0 auto; margin-top:60px;}
	.main .video .video-area .video-box:nth-child(1) {margin-top:0;}
	.main .video .video-area .video-box .video-title {margin-top:50px;}
	.main .video .video-area .video-box .video-title h1 {font-size:32px; margin-bottom:15px;}
	.main .video .video-area .video-box .video-title h2 {font-size:22px;}

	.main .history {padding:0 0 150px 0;}
	.main .history:before {height:120px;}
	.main .history:after {height:550px;}
	.main .history .cont > * {width:100%; display:block;}
	.main .history .cont .title {padding:0 20px; font-size:160px; text-align:right; -webkit-transform:translateY(30px); -moz-transform:translateY(30px); transform:translateY(30px);}
	.main .history .cont .img-box {width:70%; margin-top:-20%;}
	.main .history .cont .img-box .img-02 {position:relative; right:auto; bottom:auto; -webkit-transform:translate(38%, -20%); -moz-transform:translate(38%, -20%); transform:translate(38%, -20%);}	
	.main .history .cont .txt-box {width:100%; padding:20px 0 0 80px;}
	.main .history .cont .txt-box .tlt {height:150%; top:20px;}
	.main .history .cont .txt-box .tlt > * {font-size:22px; margin-bottom:40px;}
	.main .history .cont .txt-box .tlt span {font-size:22px;}
	.main .history .cont .txt-box h1 {font-size:28px; letter-spacing:-1.5px;}
	.main .history .cont .txt-box h1 .br {display:inline-block;}
	.main .history .cont .txt-box .txt {margin-top:55px; font-size:17px;}
	.main .history .cont .txt-box .txt .br {display:inline-block;}
	.main .history .slide-area {margin-top:160px;}
	.main .history .slide-area .slick-list {margin:0 -20px;}
	.main .history .slide-area .slick-slide {margin:0 20px;}
	.main .history .counter-area {margin-top:120px;}
	.main .history .counter-area h1 {font-size:32px;}
	.main .history .counter-area .counter-wrap {margin:80px auto 0 auto; max-width:750px;}
	.main .history .counter-area .counter-wrap .counter-box {margin-left:0; width:50%; margin-top:50px; box-sizing:border-box; padding:0 30px;}
	.main .history .counter-area .counter-wrap .counter-box:nth-child(-n+2) {margin-top:0;}
	.main .history .counter-area .counter-wrap .counter-box .counter {font-size:100px; margin-bottom:30px;}
	.main .history .counter-area .counter-wrap .counter-box .counter:after { font-size:70px;}
	.main .history .counter-area .counter-wrap .counter-box .txt {font-size:18px;}

	.main .vision {margin:150px 0;}
	.main .vision .title-box h1 {font-size:160px; margin-bottom:30px;}
	.main .vision .title-box .txt {font-size:28px;}
	.main .vision .vision-area {margin-top:100px;}
	.main .vision .vision-area .slide-arrow {top:230px;}
	.main .vision .vision-area .slide-arrow > * {font-size:18px;}
	.main .vision .vision-area .vision-wrap .vision-slide {width:80%;}
	.main .vision .vision-area .vision-wrap .vision-box {height:280px;}
	.main .vision .vision-area .vision-wrap .vision-box > .inner {padding-right:30px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box {width:60%;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h1 {font-size:32px; margin:10px 0; margin-bottom:40px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h2 {font-size:22px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box .txt {font-size:17px; margin-bottom:40px;}
	.main .vision .vision-area .vision-wrap .vision-box .btn-more {width:120px; height:45px;}
	.main .vision .vision-area .vision-wrap .vision-box .btn-more a {font-size:15px; line-height:41px;}
	.main .vision .vision-area .tlt {font-size:22px; /*left:10px;*/}

	.main .coworker {height:520px;}
	.main .coworker .coworker-wrap .txt-box h1 {font-size:31px; margin-bottom:30px;}
	.main .coworker .coworker-wrap .txt-box .txt {font-size:20px;}
	.main .coworker .coworker-wrap ul {margin:30px 0 50px 0;}
	.main .coworker .coworker-wrap ul li a {font-size:22px;}
	.main .coworker .coworker-wrap .btn {width:140px; height:55px;}
	.main .coworker .coworker-wrap .btn a {font-size:18px; line-height:51px;}

}


@media screen and (max-width: 900px){

	.main {padding:80px 0 0 0;}

}


@media screen and (max-width: 768px){

	.main .main-title {height:80px; margin:40px auto;}

	.main .visual {height:420px;}
	.main .visual .visual-slide .visual-box .visual-bg {height:420px;}
	.main .visual .visual-slide .visual-box .txt-box {padding:40px 0 0 40px; font-size:35px;}

	.main .video {margin:90px 0 200px 0;}
	.main .video .txt-box {font-size:18px; margin-bottom:65px;}
	.main .video .video-area .video-box {margin-top:50px;}
	.main .video .video-area .video-box .video-title {margin-top:40px;}
	.main .video .video-area .video-box .video-title h1 {font-size:28px;}
	.main .video .video-area .video-box .video-title h2 {font-size:20px;}

	.main .history {padding:0 0 120px 0;}
	.main .history:before {height:90px;}
	.main .history:after {height:400px;}
	.main .history .cont .title {font-size:130px;}
	.main .history .cont .txt-box {padding:20px 0 0 60px;}
	.main .history .cont .txt-box .tlt > * {font-size:20px;}
	.main .history .cont .txt-box .tlt span {font-size:20px;}
	.main .history .cont .txt-box h1 {font-size:22px; letter-spacing:-1px;}
	.main .history .cont .txt-box .txt {margin-top:45px; font-size:16px;}
	.main .history .slide-area {margin-top:100px;}
	.main .history .slide-area .slick-list {margin:0 -10px;}
	.main .history .slide-area .slick-slide {margin:0 10px;}
	.main .history .counter-area {margin-top:150px;}
	.main .history .counter-area h1 {font-size:22px;}
	.main .history .counter-area .counter-wrap {margin:60px auto 0 auto;}
	.main .history .counter-area .counter-wrap .counter-box {margin-top:40px; padding:0 30px;}
	.main .history .counter-area .counter-wrap .counter-box .counter {font-size:75px; margin-bottom:20px;}
	.main .history .counter-area .counter-wrap .counter-box .counter:after {font-size:55px;}
	.main .history .counter-area .counter-wrap .counter-box .txt {font-size:15px;}

	.main .vision {margin:120px 0;}
	.main .vision .title-box h1 {font-size:130px; margin-bottom:30px;}
	.main .vision .title-box .txt {font-size:22px;}
	.main .vision .vision-area {margin-top:80px;}
	.main .vision .vision-area .slide-arrow {top:0; text-align:center;}
	.main .vision .vision-area .slide-arrow > * {font-size:16px;}
	.main .vision .vision-area .vision-wrap {padding-top:40px;}
	.main .vision .vision-area .vision-wrap .vision-slide {width:100%;}
	.main .vision .vision-area .vision-wrap .vision-box {width:100%; height:350px; position:relative;}
	.main .vision .vision-area .vision-wrap .vision-box > .inner {padding-right:0;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box {width:100%; text-align:center;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h1 {font-size:28px; margin:15px 0; margin-bottom:30px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h2 {font-size:20px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box .txt {font-size:15px; margin-bottom:30px;}
	.main .vision .vision-area .vision-wrap .vision-box .btn-more {width:100px; height:40px; margin-left:auto; margin-right:auto;}
	.main .vision .vision-area .vision-wrap .vision-box .btn-more a {font-size:14px; line-height:36px;}
	.main .vision .vision-area .tlt {display:none;}

	.main .coworker {height:500px; position:relative;}
	.main .coworker:before {content:""; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; left:0; top:0; z-index:0;}
	.main .coworker .coworker-wrap {position:relative; z-index:10;}
	.main .coworker .coworker-wrap .txt-box {text-align:center;}
	.main .coworker .coworker-wrap .txt-box h1 {font-size:27px; margin-bottom:20px;}
	.main .coworker .coworker-wrap .txt-box .txt {font-size:18px;}
	.main .coworker .coworker-wrap .txt-box .txt .br {display:inline-block;}
	.main .coworker .coworker-wrap ul {margin:20px 0 40px 0; text-align:center;}
	.main .coworker .coworker-wrap ul li a {font-size:20px;}
	.main .coworker .coworker-wrap .btn {display:block; width:120px; height:50px; margin:0 auto;}
	.main .coworker .coworker-wrap .btn a {font-size:14px; line-height:46px;}

}


@media screen and (max-width: 600px){}


@media screen and (max-width: 480px){

	.main {padding:60px 0 0 0;}

	.main .main-title {height:60px; margin:30px auto;}

	.main .visual {height:300px;}
	.main .visual .visual-slide .visual-box .visual-bg {height:300px;}
	.main .visual .visual-slide .visual-box .txt-box {padding:30px 0 0 30px; font-size:26px;}

	.main .video {margin:60px 0 150px 0;}
	.main .video .txt-box {font-size:15px; margin-bottom:45px;}
	.main .video .video-area .video-box {margin-top:50px;}
	.main .video .video-area .video-box .video-inner:after {border-width:12px 0; border-left:24px solid #c0a75d;}
	.main .video .video-area .video-box .video-title {margin-top:30px;}
	.main .video .video-area .video-box .video-title h1 {font-size:22px; margin-bottom:10px;}
	.main .video .video-area .video-box .video-title h2 {font-size:16px;}

	.main .history {padding:0 0 80px 0;}
	.main .history:before {height:70px;}
	.main .history:after {height:300px;}
	.main .history .cont .title {font-size:90px; -webkit-transform: translateY(20px); -moz-transform: translateY(20px); transform: translateY(20px);}
	.main .history .cont .txt-box {padding:20px 0 0 50px;}
	.main .history .cont .txt-box .tlt > * {font-size:16px;}
	.main .history .cont .txt-box .tlt span {font-size:16px;}
	.main .history .cont .txt-box h1 {font-size:22px;}
	.main .history .cont .txt-box .txt {margin-top:45px; font-size:16px;}
	.main .history .slide-area {margin-top:70px;}
	.main .history .counter-area {margin-top:100px;}
	.main .history .counter-area h1 {font-size:18px;}
	.main .history .counter-area .counter-wrap {margin:40px auto 0 auto;}
	.main .history .counter-area .counter-wrap .counter-box {margin-top:30px; padding:0 20px;}
	.main .history .counter-area .counter-wrap .counter-box .counter {font-size:50px; margin-bottom:10px;}
	.main .history .counter-area .counter-wrap .counter-box .counter:after {font-size:35px;}
	.main .history .counter-area .counter-wrap .counter-box .txt {font-size:13px;}
	.main .history .counter-area .counter-wrap .counter-box .txt .br {display:inline-block;}

	.main .vision {margin:80px 0;}
	.main .vision .title-box h1 {font-size:90px; margin-bottom:20px;}
	.main .vision .title-box .txt {font-size:18px;}
	.main .vision .title-box .txt .br {display:inline-block;}
	.main .vision .vision-area {margin-top:60px;}
	.main .vision .vision-area .slide-arrow > * {font-size:14px; margin-right:12px;}
	.main .vision .vision-area .slide-arrow .arrow {width:12px; height:15px;}
	.main .vision .vision-area .slide-arrow .arrow:before {width:7px; height:7px;}
	.main .vision .vision-area .vision-wrap .vision-box {height:300px; position:relative; display:block;}
	.main .vision .vision-area .vision-wrap .vision-box.vision-1 {background-position:right center;}
	.main .vision .vision-area .vision-wrap .vision-box.vision-2 {background-position:right 10% center;}
	.main .vision .vision-area .vision-wrap .vision-box > .inner {width:100%; padding:20px; position:absolute; left:0; top:50%; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%);}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box {width:100%;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h1 {font-size:18px; margin:12px 0; margin-bottom:20px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box h2 {font-size:15px;}
	.main .vision .vision-area .vision-wrap .vision-box .txt-box .txt {font-size:12px; margin-bottom:20px;}
	.main .vision .vision-area .vision-wrap .vision-box .btn-more {width:90px; height:35px;}
	.main .vision .vision-area .vision-wrap .vision-box .btn-more a {font-size:12px; line-height:31px;}
	.main .vision .vision-area .tlt {font-size:16px;}

	.main .coworker {height:500px;}
	.main .coworker .coworker-wrap .txt-box {width:70%; margin:0 auto;}
	.main .coworker .coworker-wrap .txt-box h1 {font-size:21px; margin-bottom:20px;}
	.main .coworker .coworker-wrap .txt-box .txt {font-size:15px;}
	.main .coworker .coworker-wrap ul {margin:15px 0 30px 0;}
	.main .coworker .coworker-wrap ul li a {font-size:16px;}
	.main .coworker .coworker-wrap .btn {width:100px; height:45px;}
	.main .coworker .coworker-wrap .btn a {font-size:12px; line-height:41px;}

}