@charset "utf-8";

@import url("common.css");

.visual {position:relative; top:-32px;}
.visual .slick-slider {position:relative; left:50%; margin-left:-960px; width:1920px;}
.visual .deco {position:absolute; z-index:1; left:50%; top:50%; margin-left:-650px; color:#fff; width:1300px; transform:translateY(-50%);}
.visual .deco strong {font-size:6.5rem; font-weight:600; font-family:'cormorant-garamond';}
.visual .deco p {position:relative; margin-top:50px; padding-top:50px;}
.visual .deco p:before {content:''; position:absolute; z-index:1; left:0; top:0; width:55px; height:2px; background:#fff;}
.visual .deco p span {display:block; font-size:1.8rem; line-height:1.8; font-weight:300;}

.visual .slick-slider {background:#000;}
.visual .slick-dots {position:absolute; z-index:1; left:0; width:100%; bottom:35px; text-align:center;}
.visual .slick-dots li {display:inline-block; width:10px; height:10px; border-radius:10px; text-indent:-9999px; background:#fff;}
.visual .slick-dots li.slick-active {background:#b41f25;}
.visual .slick-dots li + li {margin-left:10px;}

.quick {margin-top:48px;}
.quick ul li {float:left; width:25%; height:305px; text-align:center; background-color:#b41f25; background-repeat:no-repeat; background-position:center 55px; transition:all .3s ease;}
.quick ul li:nth-child(even) {background-color:#cb272e;}
.quick ul li:hover {background-position:center 45px;}
.quick ul li a {display:block; padding:150px 20px 0; color:#fff;}
.quick ul li a strong {display:block; margin-bottom:15px; font-size:1.8rem; font-weight:500;}
.quick ul li a p span {display:block; font-size:1.4rem; line-height:1.5; font-weight:200; opacity:0.8}
.quick ul li.quick01 {background-image:url(../images/ico/ico_quick01.png);}
.quick ul li.quick02 {background-image:url(../images/ico/ico_quick02.png);}
.quick ul li.quick03 {background-image:url(../images/ico/ico_quick03.png);}
.quick ul li.quick04 {background-image:url(../images/ico/ico_quick04.png);}

.board_list {margin-top:120px;}
.board_list .tab li {position:relative; float:left;}
.board_list .tab li + li {margin-left:50px;}
.board_list .tab li a {display:block; font-size:2.8rem; color:#525252; font-weight:200;}
.board_list .tab li.on a {font-weight:600; padding-bottom:10px; color:#000}
.board_list .tab li.on a:after {content:''; position:absolute; z-index:1; left:0; bottom:0; width:100%; height:5px; background:#cb272e;}
.board_list .tab_con {margin-top:40px;}
.board_list .tab_con > div {display:none; position:relative;}

.board_list .board_slide .slick-arrow {position:absolute; z-index:1; left:50%; bottom:0; width:65px; height:65px; text-indent:-9999px; background-color:#cb272e; background-position:center; background-repeat:no-repeat; transition:all .3s ease;}
.board_list .board_slide .slick-arrow:hover {background-color:#b41f25;}
.board_list .board_slide .slick-arrow.slick-prev {margin-left:82px; background-image:url(../images/ico/ico_prev.png);}
.board_list .board_slide .slick-arrow.slick-next {margin-left:147px; background-image:url(../images/ico/ico_next.png);}

.board_list .photo {float:left; width:calc(100% - 438px); height:490px; overflow:hidden;}
.board_list .photo img {width:100%; min-height:100%;}
.board_list .board_con {float:right; width:438px; padding:35px 0 0 50px;}
.board_list .board_con .title {padding-bottom:30px; margin-bottom:35px; border-bottom:1px solid #ccc;}
.board_list .board_con .title i {display:block; font-size:1.8rem; color:#cb272e; font-weight:600;}
.board_list .board_con .title strong {display:block; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin-top:20px; font-size:2.8rem; font-weight:400; line-height:1.5; word-break:keep-all; overflow:hidden; height:8.3rem;}
.board_list .board_con .title span {display:block; margin-top:20px; font-weight:200; color:#444;}
.board_list .board_con .con p {line-height:1.6; font-weight:200; color:#666; word-break:keep-all;}
.board_list .board_con .con a {display:inline-block; padding-right:20px; margin-top:40px; font-weight:500; background:url(../images/ico/ico_plus.png) no-repeat right center;}

.recent_list {position:relative; margin-top:120px;}
.recent_list h3 {display:inline-block; padding-bottom:5px; font-size:2.8rem; font-weight:600; border-bottom:5px solid #cb272e;}
.recent_list ul {margin:40px -8px 0;}
.recent_list ul li {float:left; width:calc(33.33% - 16px); margin:0 8px; background:#fff;}
.recent_list ul li .thumb {height:260px; overflow:hidden;}
.recent_list ul li .thumb img {width:100%; min-height:100%;}
.recent_list ul li .con {position:relative; padding:45px 35px 35px;}
.recent_list ul li .con i {display:block; position:absolute; z-index:1; left:35px; top:-24px; width:48px; height:48px; text-align:center; line-height:48px; font-size:1.5rem; color:#fff; font-weight:500; background:#e0343b;}
.recent_list ul li .con strong {display:block; font-size:2.0rem; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.recent_list ul li .con p {margin-top:15px; color:#666; height:6.6rem; font-size:1.5rem; font-weight:300; line-height:1.5;}
.recent_list ul li .con span {display:block; margin-top:25px; font-size:1.5rem; color:#888;}
.recent_list > a {display:inline-block; position:absolute; z-index:1; right:0; top:30px; padding-right:20px; font-weight:500; background:url(../images/ico/ico_plus.png) no-repeat right center;}

.big_quick {margin:100px auto 60px;}
.big_quick ul {margin:0 -8px;}
.big_quick ul li {float:left; width:calc(25% - 16px); margin:0 8px; text-align:center;}
.big_quick ul li a {display:block; padding:160px 0 55px; line-height:1; border-radius:16px; background-color:#fff; background-position:center 55px; background-repeat:no-repeat; border:5px solid #fff; transition:all .3s ease;}
.big_quick ul li a strong {display:block; font-size:2.0rem; font-weight:400; color:#000;}
.big_quick ul li a p {margin-top:15px; font-size:1.5rem; color:#666;}
.big_quick ul li a:hover {border-color:#c7141b; background-color:#e0343b;}
.big_quick ul li a:hover strong,
.big_quick ul li a:hover p {color:#fff;}
.big_quick ul li.b_quick01 a {background-image:url(../images/ico/ico_btm_quick01.png);}
.big_quick ul li.b_quick02 a {background-image:url(../images/ico/ico_btm_quick02.png);}
.big_quick ul li.b_quick03 a {background-image:url(../images/ico/ico_btm_quick03.png);}
.big_quick ul li.b_quick04 a {background-image:url(../images/ico/ico_btm_quick04.png);}
.big_quick ul li.b_quick01 a:hover {background-image:url(../images/ico/ico_btm_quick01_ov.png);}
.big_quick ul li.b_quick02 a:hover {background-image:url(../images/ico/ico_btm_quick02_ov.png);}
.big_quick ul li.b_quick03 a:hover {background-image:url(../images/ico/ico_btm_quick03_ov.png);}
.big_quick ul li.b_quick04 a:hover {background-image:url(../images/ico/ico_btm_quick04_ov.png);}

.sns_quick {margin:0 -8px;}
.sns_quick a {position:relative; display:block; float:left; width:calc(33.33% - 16px); line-height:72px; margin:0 8px; padding:0 30px; border-radius:12px;  font-weight:200; transition:all .3s ease; overflow:hidden;}
.sns_quick a:after {content:''; position:absolute; z-index:1; right:30px; top:50%; width:22px; height:22px; margin-top:-11px; background:url(../images/ico/ico_quick_arrow.png) no-repeat 0 0; transition:all .3s ease;}
.sns_quick a:hover:after {right:20px;}
.sns_quick a:before {content:''; position:absolute; z-index:1; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.3); opacity:0; transition:all .3s ease;}
.sns_quick a:hover:before {opacity:1;}
.sns_quick a.sm_blog {background-color:#02c257;}
.sns_quick a.sm_face {background-color:#3c579e;}
.sns_quick a.sm_oak {background-color:#505050;}
.sns_quick a i {position:relative; z-index:2; float:left; margin-right:15px;}
.sns_quick a p {position:relative; z-index:2; font-size:1.5rem; color:#fff;}


.sns_quick_4 {margin:0 -8px;}
.sns_quick_4 a {position:relative; display:block; float:left; width:calc(25% - 16px); line-height:72px; margin:0 8px; padding:0 30px; border-radius:12px;  font-weight:200; transition:all .3s ease; overflow:hidden;}
.sns_quick_4 a:after {content:''; position:absolute; z-index:1; right:30px; top:50%; width:22px; height:22px; margin-top:-11px; background:url(../images/ico/ico_quick_arrow.png) no-repeat 0 0; transition:all .3s ease;}
.sns_quick_4 a:hover:after {right:20px;}
.sns_quick_4 a:before {content:''; position:absolute; z-index:1; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.3); opacity:0; transition:all .3s ease;}
.sns_quick_4 a:hover:before {opacity:1;}
.sns_quick_4 a.sm_blog {background-color:#02c257;}
.sns_quick_4 a.sm_face {background-color:#3c579e;}
.sns_quick_4 a.sm_oak {background-color:#505050;}
.sns_quick_4 a.sm_kakao {background-color:#D4BF00;}
.sns_quick_4 a i {position:relative; z-index:2; float:left; margin-right:15px;}
.sns_quick_4 a p {position:relative; z-index:2; font-size:1.5rem; color:#fff;}

/*****************************************************************************************************************************************************************************************/


@media all and (max-width:1299px){
	.visual .slick-slider {width:1600px;}
	.visual .deco {left:0; width:100%; padding-left:20px; margin-left:0;}

	.quick ul li a p span {display:inline; word-break:keep-all; margin-right:5px;}

	.board_list .board_slide .slick-arrow {width:50px; height:50px; background-size:8px;}
	.board_list .board_slide .slick-arrow.slick-prev {right:50px; left:initial; margin-left:0;}
	.board_list .board_slide .slick-arrow.slick-next {right:0px; left:initial; margin-left:0;}

	.board_list .board_con {padding-top:10px;}

	.sns_quick a {padding:20px 30px; line-height:1.5;}
	.sns_quick a p {width:90%; word-break:keep-all;}

	.sns_quick_4 a {padding:20px 30px; line-height:1.5;}
	.sns_quick_4 a p {width:90%; word-break:keep-all;}
} 
	
@media all and (max-width:950px){
	.visual {top:0;}
	.visual .slick-slider {width:1000px; margin-left:-500px;}
	
	.visual .deco strong {font-size:5.0rem;}
	.visual .deco p {margin-top:30px; padding-top:30px;}
	.visual .deco p:before {width:30px;}

	.quick ul li {width:50%; height:205px; background-position:center 25px}
	.quick ul li a {padding-top:110px;}
	.quick ul li:nth-child(2),
	.quick ul li:nth-child(3) {background-color:#cb272e;}
	.quick ul li:nth-child(4) {background-color:#b41f25;}
	
	.recent_list ul li .thumb {height:195px;}
	
	.sns_quick {margin:0;}
	.sns_quick a {float:none; width:100%; padding:20px; margin:0;}
	.sns_quick a + a {margin-top:10px;}
	.sns_quick a p {font-size:1.8rem;}
	.sns_quick a.sm_blog i {width:40px;}
	.sns_quick a.sm_face i {width:60px;}
	.sns_quick a.sm_oak i {width:40px;}
	.sns_quick a:after {right:20px;}

	.sns_quick_4 {margin:0;}
	.sns_quick_4 a {float:none; width:100%; padding:20px; margin:0;}
	.sns_quick_4 a + a {margin-top:10px;}
	.sns_quick_4 a p {font-size:1.8rem;}
	.sns_quick_4 a.sm_blog i {width:40px;}
	.sns_quick_4 a.sm_face i {width:60px;}
	.sns_quick_4 a.sm_oak i {width:40px;}
	.sns_quick_4 a.sm_kakao i {width:40px;}
	.sns_quick_4 a:after {right:20px;}
}


@media all and (max-width:768px){
	.board_list {margin-top:50px;}
	.board_list .tab li + li {margin-left:20px;}
	.board_list .tab li a {font-size:2.6rem;}
	.board_list .tab li.on a:after {height:3px;}
	.board_list .tab_con {margin-top:20px;}
	.board_list .photo {float:none; width:100%; height:auto; max-height:300px; overflow:hidden;}
	.board_list .board_con {float:none; width:100%; padding:10px 0 0; margin-top:20px;}
	.board_list .board_con .title {padding-bottom:15px; margin-bottom:15px;}
	.board_list .board_con .title strong {display:block; margin-top:10px; height:auto; white-space:nowrap; text-overflow:ellipsis;}
	.board_list .board_con .con a {margin-top:20px; padding-bottom:20px; background-position:right 3px;}

	.recent_list {margin-top:80px}
	.recent_list h3 {font-size:2.6rem;}
	.recent_list ul li .thumb {height:160px; overflow:hidden;}

	.big_quick {margin:50px 0;}
	.big_quick ul {margin:-5px;}
	.big_quick ul li {width:calc(50% - 10px); margin:5px;}
	.big_quick ul li a {padding:90px 0 25px; background-position:center 25px;}
} 

@media all and (max-width:640px){
	.visual .slick-slider {width:900px; margin-left:-600px;}
	.visual .slick-dots {margin-left:150px;}
	.visual .deco {top:60px; transform:translate(0);}
	.visual .deco p {margin-top:0; text-shadow:0px 0px 10px rgba(0,0,0,0.9);}
	.visual .deco p:before {display:none;}

	.visual .deco strong {font-size:3.5rem;}
	.visual .deco p {width:80%;}
	.visual .deco p span {display:inline; word-break:keep-all;}
	.visual .deco p span {margin-right:5px;}	

	.quick ul li {height:250px;}
	
	.recent_list ul {margin:20px 0 0;}
	.recent_list ul li {margin:0;}
	.recent_list ul li .thumb {width:100%; height:auto; max-height:200px; overflow:hidden;}
	.recent_list ul li .thumb img {width:100%;}
	.recent_list > a {top:20px;}

	.paging {margin-top:20px;}

	.big_quick ul li a {background-size:50px;}

	.sns_quick a p {font-size:1.6rem;}
	
	.sns_quick_4 a {float:none; width:100%; height:50px;padding:15px; margin:0;}
	.sns_quick_4 a p {font-size:1.6rem;}
	.sns_quick_4 a.sm_kakao i img{height:27px;}
} 

@media all and (max-width:480px){
	.quick ul li {height:275px;}
} 

@media all and (max-width:320px){
	.big_quick ul li a p {font-size:1.3rem;}
} 