@charset "utf-8";

/* 대표 인사말 */
.greeting {}
.greeting .imageBox {display:inline-block; width:49%;}
.greeting .imageBox .image {position:relative; max-width:70%;}
.greeting .imageBox .image img {box-shadow:9px 9px 9px rgba(0,0,0,0.24);}
.greeting .imageBox .image01 {}
.greeting .imageBox .image02 {margin-top:-15%; margin-left:21%;}
.greeting .textBox { display:inline-block; width:50.5%; background-image:url('../img/content/greetingTextBoxBg.png'); background-repeat:no-repeat; background-position:center; vertical-align:top; font-size:16px;}
.greeting .textBox h5 {font-size:38px; color:#467e48; font-family:'Noto Serif JP',sans-serif; margin-bottom:20px; }
.greeting .textBox p {color:#2d2d2d; line-height:180%; margin-bottom:34px; font-weight:300;}
.greeting .textBox p b {color:#467e48; font-weight:500; font-size:18px;}
.greeting .textBox p .br {display:block;}
.greeting .textBox .name {text-align:right; line-height:180%; padding-top:25px;}
.greeting .textBox .name b {font-size:28px; font-weight:500;}

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

	@media screen and (max-width:1299px) {
		.greeting .textBox {float:right; display:inline-block; width:50.5%;}
	}

	@media screen and (max-width:1199px) {
		.greeting .textBox p .br {display:inline;}
	}

	@media screen and (max-width:999px) {
		.greeting .imageBox {display:block; width:60%; margin:0 auto; margin-bottom:40px;}
		.greeting .textBox {float:none; display:block; width:80%; margin:0 auto; font-size:100%;}
		.greeting .textBox h5 {font-size:220%;}
		.greeting .textBox .name b {font-size:160%;}
		.greeting .imageBox .image02 {margin-top:-27%; margin-left:40%;}
	}

	@media screen and (max-width:799px) {
		.greeting .imageBox {width:80%;}
		.greeting .textBox {font-size:95%; width:90%; background-size:contain;}
	}


	@media screen and (max-width:499px) {
		.greeting .imageBox {width:90%; margin-bottom:20px;}
		.greeting .textBox {font-size:90%; background-size:50%;}
		.greeting .textBox h5 {font-size:200%;}
		.greeting .textBox p {margin-bottom:20px;}
		.greeting .textBox .name {margin-top:15px;}
		.greeting .textBox .name b {font-size:140%;}
	}


/* 연혁 */
.history {text-align:center;}
.history .historyBox {display:inline-block;}
.history .historyBox .year {}
.history .historyBox .year h5 {position:relative; display:inline-block; width:85px; top:-2px; font-family:'Montserrat', sans-serif; font-size:24px; font-weight:600; color:#777; vertical-align:top; text-align:left;}
.history .historyBox .year ul.textBox {position:relative; display:inline-block; vertical-align:top; text-align:left; width:720px; padding-bottom:20px;}
.history .historyBox .year ul.textBox:before {position:absolute; display:inline-block; width:1px; height:100%; top:10px; left:7px; background:#ebebeb; content:'';}
.history .historyBox .year ul.textBox li {position:relative; padding-left:40px; margin-bottom:28px; color:#969696; font-size:16px; font-weight:400; letter-spacing:0;}
.history .historyBox .year ul.textBox li:before {position:absolute; display:inline-block; width:7px; height:7px; border-radius:50%; background:#ebebeb; top:10px; left:4px; content:'';}
.history .historyBox .year ul.textBox li .sText {display:inline-block; background:#5a9933; color:#fff; font-size:14px; font-weight:300; padding:0 8px; margin-bottom:2px;}

.history .historyBox .year ul.textBox li:first-child:before {width:16px; height:16px; top:5px; left:0; background:#5a9933;}
.history .historyBox .year ul.textBox li:first-child:after {position:absolute; display:inline-block; top:8px; left:3px; width:10px; height:10px; background:#fff; border-radius:50%; content:'';}

.history .historyBox .year:last-child ul.textBox {padding-bottom:0;}
.history .historyBox .year:last-child ul.textBox:before {height:calc(100% - 20px);}
.history .historyBox .year:last-child ul.textBox li:last-child {margin-bottom:0;}

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

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

	@media screen and (max-width:999px) {
		.history .historyBox .year h5 {font-size:140%;}
		.history .historyBox .year ul.textBox {width:calc(100% - 95px);}
		.history .historyBox .year ul.textBox li {font-size:100%;}
	}

	@media screen and (max-width:799px) {
		.history {padding:0 4%;}
		.history .historyBox .year h5 {width:75px;}
		.history .historyBox .year ul.textBox {width:calc(100% - 85px);}
		.history .historyBox .year ul.textBox li {font-size:95%; padding-left:30px;}
		.history .historyBox .year ul.textBox li .sText {display:block;}
	}

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

	@media screen and (max-width:499px) {
		.history .historyBox .year {margin-bottom:20px;}
		.history .historyBox .year h5 {display:block; width:100%; font-size:120%; margin-bottom:10px;}
		.history .historyBox .year ul.textBox {display:block; width:100%; padding-bottom:0;}
		.history .historyBox .year ul.textBox li {font-size:90%; margin-bottom:10px; line-height:160%;}
	}


.certification {}
.certification h5.tit {font-size:24px; color:#000; margin-bottom:16px;}

.certification .certi01 {border-bottom:1px solid #f5f5f5; padding-bottom:20px;}
.certification .certi01 .secti01Wrap {margin:0 -15px;}
.certification .certi01 .certiBox {display:inline-block; width:389px; height:339px; color:#646464; background:#fafafa; border-top:2px solid #e6e6e6; border-bottom:1px solid #e6e6e6; padding:50px 40px; vertical-align:top; margin:0 15px 37px;}
.certification .certi01 .certiBox h6 {position:relative; font-size:19px; font-weight:500; padding-left:25px; margin-bottom:23px;}
.certification .certi01 .certiBox h6:before {position:absolute; display:inline-block; width:17px; height:17px; top:calc(50% - 9px); left:0; background:#5a9933; border-radius:50%; content:''}
.certification .certi01 .certiBox h6:after {position:absolute; display:inline-block; width:9px; height:9px; top:calc(50% - 5px); left:4px; background:#fff; border-radius:50%; content:''}
.certification .certi01 .certiBox .listOl {font-weight:300; padding-left:25px;}
.certification .certi01 .certiBox .listOl li {line-height:160%; }
.certification .certi01 .certiBox .listOl li:before {position:relative; display:inline-block; margin-left:-16px; margin-right:10px; content:'-';}
.certification .certi01 .certiBox .subListUl {font-weight:300; padding-left:45px;}
.certification .certi01 .certiBox .subListUl li {}
.certification .certi01 .certiBox .subListUl li:before {position:relative; display:inline-block; margin-left:-16px; margin-right:5px; content:'˙';}

.certification .certi01 .certiBox.widthTwo {width:811px;}

.certification .certi02 h5.tit,
.certification .certi03 h5.tit {margin-top:54px;}

.certification .certi02 ul.certiImage {text-align:center; margin:0 -10px;}
.certification .certi02 ul.certiImage li {width:calc(19% - 20px); display:inline-block; vertical-align:top; margin:0 10px;}
.certification .certi02 ul.certiImage li .image {margin-bottom:15px;}
.certification .certi02 ul.certiImage li .image img {border:1px solid #cacaca;}
.certification .certi02 ul.certiImage li h6 {font-size:18px; color:#4f4f4f; line-height:140%; }

.certification .certi03 {border-bottom:1px solid #f5f5f5; padding-bottom:58px;}
.certification .certi03 ul.certiMark {text-align:center; margin:0 -23px;}
.certification .certi03 ul.certiMark li {display:inline-block; vertical-align:top; margin:0 23px;}
.certification .certi03 ul.certiMark li .image {margin-bottom:15px;}
.certification .certi03 ul.certiMark li h6 {font-size:18px; color:#4f4f4f; line-height:120%;}
.certification .certi03 ul.certiMark li h6 .num {font-size:16px; color:#8c8c8c; font-weight:300;}

	@media screen and (max-width:1419px) {
		.certification .certi01 .secti01Wrap {margin:0 -1%;}
		.certification .certi01 .certiBox {width:30.1%; padding:3% 2%; margin:0 1.5% 3%;}
		.certification .certi01 .certiBox.widthTwo {width:63.3%;}
	}

	@media screen and (max-width:1199px) {
		.certification .certi02 ul.certiImage li {width:22%; margin:0 1.3%;}
		.certification .certi03 ul.certiMark li {width:22%; margin:0 1.3%;}
		.certification .certi03 ul.certiMark li .image img {width:auto !important; max-width:inherit !important; height:23vmin !important;}
	}

	@media screen and (max-width:999px) { 
		.certification h5.tit {font-size:140%;}
		.certification .certi01 .certiBox {width:46.8%; height:279px; padding:3% 2%; font-size:90%;}
		.certification .certi01 .certiBox h6 {font-size:120%;}
		.certification .certi01 .certiBox.widthTwo {width:97%;}

		.certification .certi02 ul.certiImage li h6 {font-size:90%;}

		.certification .certi03 ul.certiMark li h6 {font-size:100%;}
		.certification .certi03 ul.certiMark li h6 .num {font-size:80%;}
	}

	@media screen and (max-width:799px) {
		.certification h5.tit {font-size:120%;}
		.certification .certi01 .certiBox {width:47.3%; margin:0 1% 2%; padding:4%; font-size:85%;}
		.certification .certi01 .certiBox h6 {font-size:110%; margin-bottom:18px;}
		.certification .certi01 .certiBox.widthTwo {width:98%;}

		.certification .certi02 ul.certiImage li {width:45%; margin-top:20px;}
		.certification .certi02 ul.certiImage li h6 {font-size:85%;  }

		.certification .certi03 ul.certiMark li {width:45%; margin-top:20px;}
		.certification .certi03 ul.certiMark li .image img {height:30vmin !important;}
		.certification .certi03 ul.certiMark li h6 {font-size:90%; }

	}

	@media screen and (max-width:599px) {
		.certification .certi01 .certiBox {width:98%; height:auto; margin:0 1% 2%; padding:6% 4%; font-size:90%;}
		.certification .certi01 .certiBox h6 {margin-bottom:10px;}
	}

	@media screen and (max-width:499px) {
		.certification h5.tit {font-size:110%;}
		.certification .certi01 .certiBox {font-size:85%;}
		.certification .certi02 ul.certiImage li h6 {font-size:80%;}
		.certification .certi03 ul.certiMark li h6 .num {display:block; width:70%; margin:0 auto;  line-height:120%; margin-top:5px;}
	}



/*오시는 길 */
.location {text-align:center; border-top:2px solid #222; border-bottom:1px solid #ddd;}
.location .infoBox {position:relative; display:block; overflow:hidden; padding:30px 0 20px 30px;}
.location .infoBox dl {position:relative; overflow:hidden; display:inline-block; padding:2px 24px 2px 22px;}
.location .infoBox dl:before {content:''; display:block; position:absolute; top:8px; left:0; width:1px; height:16px; background:rgba(0, 0, 0, 0.2);}
.location .infoBox dl:first-child {padding-left:0;}
.location .infoBox dl:first-child:before {display:none;}
.location .infoBox dl.add {}
.location .infoBox dl.tel {}
.location .infoBox dl.fax {}
.location .infoBox dl dt {display:inline-block; margin-right:10px; font-weight:500; font-size:18px; line-height:24px; color:#669933;}
.location .infoBox dl dd {display:inline-block; font-size:18px; }

#mapBox {height:400px;}

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

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

	@media screen and (max-width:999px) {
		.location .infoBox {padding:30px 0 20px;}
		.location .infoBox dl {padding:2px 2%;}
		.location .infoBox dl dt {font-size:110%;}
		.location .infoBox dl dd {font-size:110%;}
	}

	@media screen and (max-width:799px) {
		.location .infoBox {padding:20px 0;}
		.location .infoBox dl.add {display:block; text-align:center;}
		.location .infoBox dl.tel:before {display:none;}
		.location .infoBox dl dt {font-size:100%;}
		.location .infoBox dl dd {font-size:100%;}

		#mapBox {height:350px;}
	}

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

	@media screen and (max-width:499px) {
		.location .infoBox dl dt {font-size:90%; margin-right:5px;}
		.location .infoBox dl dd {font-size:90%;}

		#mapBox {height:300px;}
	}


/*석류 유래*/
.story {max-width:1200px; margin:0 auto;}
.story .imageBox {border-radius:80px 0 80px 0; overflow:hidden; margin-bottom:60px;}
.story .imageBox img {}

.story .textBox {font-size:16px; color:#5d5d5d; font-weight:300; line-height:180%;}
.story .textBox .secBox {background:#f9f9f9; padding:50px; margin-bottom:20px;}
.story .textBox h5 {font-size:24px; color:#000; margin-bottom:18px;}
.story .textBox h5:before {position:relative; display:block; width:40px; height:3px; background:#5a9933; margin-bottom:16px; content:'';}
.story .textBox h6 {font-weight:400; color:#509228; font-size:18px; margin-bottom:5px; padding-left:13px;}
.story .textBox h6:before {position:relative; display:inline-block; margin-right:5px; margin-left:-9px; content:'-';}
.story .textBox p {}
.story .textBox ul.dotUl {padding-left:25px; margin-bottom:27px;}
.story .textBox ul.dotUl:last-child {margin-bottom:0;}
.story .textBox ul.dotUl li {}
.story .textBox ul.dotUl li:before {position:relative; display:inline-block; margin-right:5px; margin-left:-9px; content:'·';}

.story .authorship {text-align:right;}

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

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

	@media screen and (max-width:999px) {
		.story .textBox {font-size:100%;}
		.story .textBox h5 {font-size:140%;}
		.story .textBox h6 {font-size:110%;}
	}

	@media screen and (max-width:799px) {
		.story .imageBox {border-radius:40px 0 40px 0; margin-bottom:20px;}
		.story .textBox {font-size:95%;}
		.story .textBox .secBox {padding:5%;}
	}

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

	@media screen and (max-width:499px) {
		.story .imageBox {border-radius:20px 0 20px 0; margin-bottom:10px;}
		.story .textBox {font-size:90%;}
		.story .textBox .secBox {padding:6%;}
		.story .textBox h5 {font-size:120%;}
		.story .textBox h5:before {margin-bottom:6px;}
		.story .textBox h6 {font-size:100%;}
		.story .textBox ul.dotUl li:before {margin-left:-12px;}
	}

.facilities {display:block; overflow:hidden;}
.facilities .facilitiesBox {float:left; width:47%; margin:0 1.5% 70px;}
.facilities .facilitiesBox .imgSlider {position:relative;}
.facilities .facilitiesBox .imgSlider .slick-arrow {position:absolute; bottom:0; right:0; background-color:rgba(256,256,256,0.6); border:0; font-size:0; width:61px; height:61px; z-index:1;}
.facilities .facilitiesBox .imgSlider .slick-arrow.slick-prev {right:61px; background-image:url('../img/content/facilitiesImgSliderArrowPrev.png'); background-position:center; background-repeat:no-repeat;}
.facilities .facilitiesBox .imgSlider .slick-arrow.slick-next {background-image:url('../img/content/facilitiesImgSliderArrowNext.png'); background-position:center; background-repeat:no-repeat;}
.facilities .facilitiesBox .imgSlider .slick-arrow.slick-next:before {position:absolute; width:1px; height:18px; top:22px; left:0; background:#fff; content:'';}
.facilities .facilitiesBox h4 {font-size:24px; color:#000; margin-top:5px;}

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

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

	@media screen and (max-width:999px) {
		.facilities .facilitiesBox h4 {font-size:120%; margin-top:10px;}
		.facilities .facilitiesBox .imgSlider .slick-arrow {width:51px; height:51px;}
		.facilities .facilitiesBox .imgSlider .slick-arrow.slick-prev {right:51px;}
	}

	@media screen and (max-width:799px) {
		.facilities .facilitiesBox {margin:0 1.5% 30px;}
		.facilities .facilitiesBox h4 {font-size:100%;}
		.facilities .facilitiesBox .imgSlider .slick-arrow {width:41px; height:41px;}
		.facilities .facilitiesBox .imgSlider .slick-arrow.slick-prev {right:41px;}
	}

	@media screen and (max-width:599px) {
		.facilities .facilitiesBox {float:none; width:97%; margin:0 1.5% 30px;}
		.facilities .facilitiesBox .imgSlider .slick-arrow {width:51px; height:51px;}
		.facilities .facilitiesBox .imgSlider .slick-arrow.slick-prev {right:51px;}
	}

	@media screen and (max-width:499px) {
		.facilities .facilitiesBox h4 {font-size:90% !important;}
	}