/**
 * @File Name : main.css
 * @Description : Layout[main] | Contents[main]
 * @Modification Information
 * <pre>
 * 수정일 | 수정자 | 수정내용
 * 2020.08.10 | 김효진 | 최초 등록
 * </pre>
 * @author 디자인팀 김효진
 * @since 2020.08.10
 *
 * @Copyright (C) IACTS.CO.KR All rights reserved.
 */

/* ◇◆ Layout[main] ◇◆◇◆◇◆◇◆◇◆ */
/* 공통 */
#body {font-family:'나눔고딕',NanumGothic,'Nanum Gothic',sans-serif;font-size:13px;letter-spacing:-.06em;overflow:hidden}
@media all and (min-width:500px){
	#body {font-size:14px}
}
@media all and (min-width:768px){
	#body {font-size:15px}
}
@media all and (min-width:1000px){
	#body {font-size:16px}
}

#wrap>.container {max-width:none;margin:auto}
.init img {max-width:100%}
[id*="mainbody"] {position:relative;padding:40px 0 30px}
[id*="mainbody"] .container {margin:auto;box-sizing:border-box;padding:0 15px}
[id*="mainbody"] .owl-carousel {display:block;}
[id*="mainbody"] .st1, [class*="mainbody"] .st2 {text-align:center;line-height:1.4;color:#000}
[id*="mainbody"] .st1 {font-size:2em;margin-bottom:15px}
[id*="mainbody"] .st2 {font-size:1.125em;margin-bottom:20px}
@media all and (min-width:768px){
	[id*="mainbody"] .st1 {font-size:2.25em}
}
@media all and (min-width:1000px){
	[id*="mainbody"] {padding:70px 0}
	[id*="mainbody"] .st2 {margin-bottom:40px}
}
@media all and (min-width:1260px){
	[id*="mainbody"] .container {padding:0}
}


/* mainbody1 */
#mainbody1 {padding:0}
#mainbody1>.container {padding:0}
/* vpr1 */
#vpr1 {position:relative;margin:auto;width:320px;height:177px}
#vpr1 .wrap1 {position:relative;width:509px;margin-left:-94px}
#vpr1 .menu .mControl .m {position:absolute;top:calc(50% - 20px);width:25px;height:41px;background:url(../../img/main/main_spr.png) no-repeat;z-index:2;border:0;background-size:auto 335px}
#vpr1 .menu .mControl .m.prev {left:1%;background-position:-108px -39px}
#vpr1 .menu .mControl .m.next {right:1%;background-position:-134px -39px}
#vpr1 .menu .mControl2 {position:absolute;top:auto;bottom:5%;z-index:2;width:100%;left:0;text-align:center;}
#vpr1 .menu .mControl2 .goPage {display:none;}
#vpr1 .menu .mControl2 .m {position:relative;display:inline-block;vertical-align:middle;width:30px;height:24px;text-indent:-9999em;border:0;background:transparent;margin-right:6px}
#vpr1 .menu .goPage .m:before {position:absolute;top:calc(50% - 5px);left:0;content:"";display:block;width:30px;height:10px;border-radius:5px;background:#fff;box-sizing:border-box}
#vpr1 .menu .goPage .m.on:before {border:2px solid #fff;background:transparent}
#vpr1 .menu .stop:before, #vpr1 .menu .play:before {position:absolute;top:0;left:5px;content:"";display:block;width:21px;height:23px;background:url(../../img/main/main_spr.png) no-repeat}
#vpr1 .menu .stop:before {background-position:-313px 0}
#vpr1 .menu .play:before {background-position:-290px 0}
@media all and (min-width:500px){
	#vpr1 {width:500px;height:267px}
	#vpr1 .wrap1 {position:static;width:768px;margin-left:-134px}
	#vpr1 .menu .mControl2 .goPage {display:inline-block;}
}
@media all and (min-width:768px){
	#vpr1 {width:768px;height:367px}
	#vpr1 .wrap1 {width:1056px;margin-left:-144px}
}
@media all and (min-width:1000px){
	#vpr1 {width:1000px;height:467px}
	#vpr1 .wrap1 {width:1344px;margin-left:-172px}
	#vpr1 .menu .mControl .m {top:calc(50% - 29px);width:36px;height:58px;background-size:auto}
	#vpr1 .menu .mControl .m.prev {left:-1%;background-position:-154px -55px}
	#vpr1 .menu .mControl .m.next {right:-1%;background-position:-192px -55px}
	#vpr1 .menu .mControl2 {bottom:25%;text-align:left;}
}
@media all and (min-width:1200px){
	#vpr1 {width:1200px;height:667px}
	#vpr1 .wrap1 {width:1920px;margin-left:-360px}
	#vpr1 .menu .mControl2 {width:1200px;left:calc(50% - 600px)}
	#vpr1 .menu .mControl .m.prev {left:-36px}
	#vpr1 .menu .mControl .m.next {right:-36px}
}
@media all and (min-width:1260px){
	#vpr1 .menu .mControl .m.prev {left:-56px}
	#vpr1 .menu .mControl .m.next {right:-56px}
}
@media all and (min-width:1400px){
	#vpr1 .menu .mControl .m.prev {left:-86px}
	#vpr1 .menu .mControl .m.next {right:-86px}
}
@media all and (min-width:1600px){
	#vpr1 .menu .mControl .m.prev {left:-186px}
	#vpr1 .menu .mControl .m.next {right:-186px}
}

/* 체험관소개/오시는길 */
#menu1 {position:relative;z-index:2;margin-top:25px;margin-left:15px;margin-right:15px;overflow:hidden;background:#f6f6f6;border-radius:5px}
#menu1 li {float:left;width:calc(50% - 5px);box-sizing:border-box;}
#menu1 li.n2 {border-left:4px solid #fff;}
#menu1 li a {display:block;text-align:center;padding-top:25px;padding-bottom:20px;box-sizing:border-box;font-size:.938em;color:#000;}
#menu1 li a:before {content:"";display:block;width:53px;height:44px;background:url(../../img/main/main_spr.png) no-repeat;margin:0 auto 10px;transition:margin .3s ease}
#menu1 li.n1 a:before {background-position:0 0}
#menu1 li.n2 a:before {background-position:-55px 0}
#menu1 li a:hover, #menu1 li a:focus {text-decoration:underline;}
#menu1 li a:hover:before {margin-top:-2px;margin-bottom:12px;}
@media all and (min-width:600px){
	#menu1 {margin-right:380px}
}
@media all and (min-width:800px){
	#menu1 {position:absolute;bottom:3%;left:6%;margin:0;background:transparent}
	#menu1 li {width:auto;}
	#menu1 li a {width:122px;height:122px;border-radius:50%;background:#fff;padding-bottom:0}
	#menu1 li.n2 {border-left:0;margin-left:10px}
}
@media all and (min-width:1000px){
	#menu1 {top:39%;left:10%;bottom:auto;}
	#menu1 li.n2 {margin-left:20px;}
}
@media all and (min-width:1260px){
	#menu1 {left:0}
}

/* 체험관 이용안내 */
#use1info {position:relative;width:306px;height:200px;z-index:2;background:url(../../img/main/main_spr.png) no-repeat -117px -81px;text-align:center;color:#fff;background-size:auto 335px;margin:50px auto 0;padding-top:36px}
#use1info .h1 {width:93px;height:85px;background:url(../../img/main/main_spr.png) 0 -122px;font-size:1.375em;color:#1f0985;letter-spacing:-.1em;font-weight:700;margin:-72px 85px 8px auto;padding-top:23px;line-height:1.2;box-sizing:border-box;background-size:auto 288px}
#use1info .h1 span {display:block;margin-left:-10px}
#use1info ul {overflow:hidden;padding:0 20px;margin-bottom:5px;margin-top:-15px;}
#use1info ul li {position:relative;float:left;width:33.333%;font-weight:600;letter-spacing:-.075em}
#use1info ul li:before {content:"";display:block;width:58px;height:53px;background:url(../../img/main/main_spr.png) no-repeat;margin:0 auto 7px;}
#use1info ul li.n1:before {background-position:-110px 0}
#use1info ul li.n2:before {background-position:-170px 0}
#use1info ul li.n3:before {background-position:-230px 0}
#use1info ul li:after {position:absolute;top:10px;left:0;content:"";display:block;width:1px;height:104px;background:#5747a4}
#use1info ul li:first-child:after {display:none}
#use1info .t1 {position:relative;letter-spacing:-.1em;margin-left:80px;text-align:left;padding-left:25px;font-size:.875em;}
#use1info .t1:before {position:absolute;top:0;left:0;content:"";display:block;width:21px;height:21px;background:url(../../img/main/main_spr.png) no-repeat -336px 0}
#use1info .t1 strong {color:#f7ff3d;}
@media all and (min-width:360px){
	#use1info {position:relative;bottom:auto;right:auto;width:350px;height:262px;background-size:auto 383px;background-position:-134px -92px;box-sizing:border-box}
	#use1info .h1 {width:133px;height:122px;background-size:auto 383px;background-position:0 -159px;padding-top:36px}
}
@media all and (min-width:600px){
	#use1info {position:absolute;bottom:-18%;right:15px;padding-top:0}
	#use1info .h1 {margin-top:-36px;margin-bottom:0;}
}
@media all and (min-width:800px){
	#use1info {bottom:-30%}
}
@media all and (min-width:1000px){
	#use1info {bottom:8.9%;right:0;width:437px;height:327px;background-size:auto;background-position:-167px -115px;}
	#use1info .h1 {width:166px;height:153px;padding-top:45px;margin-top:-45px;background-size:auto;background-position:0 -199px}
	#use1info ul {padding-right:20px;margin-top:-10px;margin-bottom:10px;}
	#use1info .t1 {margin-left:80px}
}
@media all and (min-width:1260px){
	#use1info {right:-67px;}
	#use1info .t1{font-size:1em;}
}

/* mainbody2 */
#mainbody2 {padding:40px 0}
/* 최근게시글 */
#bbs1 {position:relative;padding-top:55px}
#bbs1 .tab {position:absolute;top:0;font-size:1.25em;padding:0 18px}
#bbs1 .tab a {position:relative;display:inline-block;color:#000;font-weight:400;}
#bbs1 .tab a:before {position:absolute;top:calc(50% - 7px);left:-24px;content:"";display:block;width:2px;height:14px;background:url(../../img/main/main_spr.png) no-repeat -360px -26px}
#bbs1 .tab a:after {position:absolute;bottom:-10px;left:50%;content:"";display:block;width:0;height:4px;background:#0055a2;transition:all .4s ease}
#bbs1 .tab.on a:after {width:100%;left:0;}
#bbs1 .tab:nth-of-type(1) a:before {display:none}
#bbs1 .tab:nth-of-type(1) {left:0;padding-left:0}
#bbs1 .tab:nth-of-type(2) {left:80px}
#bbs1 .tab:nth-of-type(3) {left:179px}
#bbs1 .tab.on a {color:#00488a;font-weight:600}
#bbs1 .cont .datalist {overflow:hidden;width:100%;border:1px solid #ccc;border-radius:9px;}
#bbs1 .cont .datalist li.no-data {text-align:center;width:100%;min-height:124px;padding-top:50px;box-sizing:border-box;}
#bbs1 .cont .datalist li a {position:relative;display:block;padding:15px 20px;border-top:1px solid #ccc;}
#bbs1 .cont .datalist li a:after {position:absolute;bottom:20px;right:15px;content:"";display:block;width:25px;height:25px;background:url(../../img/main/main_spr.png) no-repeat -200px -17px;background-size:auto 330px}
#bbs1 .cont .datalist li:first-child a {border-left:0;border-top:0}
#bbs1 .cont .datalist li a strong {display:block;margin-bottom:5px;font-size:1.125em;font-weight:400;color:#000;line-height:1.333em;max-height:2.666em;overflow:hidden;}
#bbs1 .cont .datalist li a:hover strong, #bbs1 .cont .datalist li a:focus strong {text-decoration:underline;}
#bbs1 .cont .datalist li a .t1 {display:none;font-size:.875em;color:#555;line-height:1.214em;height:2.428em;overflow:hidden;margin-bottom:35px;}
#bbs1 .cont .datalist li a .date {font-size:.938em;color:#666;}
#bbs1 .b1.more {position:absolute;top:4px;right:0;width:20px;height:20px;background:url(../../img/main/main_spr.png) no-repeat -365px -26px}
@media all and (min-width:500px){
	#bbs1 .cont .datalist li {float:left;width:calc(100% / 3);}
	#bbs1 .cont .datalist li a {border-left:1px solid #ccc;border-top:0;padding:25px 20px}
	#bbs1 .cont .datalist li a strong {margin-bottom:15px}
	#bbs1 .cont .datalist li a:after {right:25px}
}
@media all and (min-width:768px){
	#bbs1 .tab {padding:0 23px}
	#bbs1 .cont .datalist li a {padding:35px 30px}
	#bbs1 .cont .datalist li a:after {bottom:25px;right:30px;width:36px;height:36px;background-size:auto;bottom:25px;right:30px;background-position:-290px -25px}
	#bbs1 .cont .datalist li a strong {margin-bottom:35px}
	#bbs1 .cont .datalist li a .t1 {display:block;}
	#bbs1 .tab:nth-of-type(2) {left:99px}
	#bbs1 .tab:nth-of-type(3) {left:219px}
}
@media all and (min-width:1000px){
	#mainbody2 {padding:60px 0}
	#bbs1 {margin-right:480px;}
	#bbs1 .b1.more {transition:all .35s ease}
	#bbs1 .b1.more:hover, #bbs1 .b1.more:focus {transform:rotate(90deg);}
	#bbs1 .cont .datalist li.no-data {min-height:244px;padding-top:115px;}
	#bbs1 .cont .datalist li a:after {transition:all .4s ease}
	#bbs1 .cont .datalist li a:hover:after, #bbs1 .cont .datalist li a:focus:after {right:25px}
}

/* 팝업존 */
#popup1 {position:relative;max-width:450px;border-radius:10px;overflow:hidden;margin:25px auto 0;}
#popup1 .menu {position:absolute;bottom:10px;right:10px;z-index:2}
#popup1 .menu .m {vertical-align:top;width:30px;height:30px;border:0;background:url(../../img/main/main_spr.png) no-repeat;background-size:auto 335px}
#popup1 .menu .m.prev {background-position:-161px -44px;width:23px;}
#popup1 .menu .m.next {background-position:-184px -44px;width:23px;margin-right:8px}
#popup1 .menu .m.stop {background-position:-209px -44px}
#popup1 .menu .m.play {background-position:-240px -44px}
@media all and (min-width:768px){
	#popup1 .menu .m {width:43px;height:43px;background-size:auto;}
	#popup1 .menu .m.prev, #popup1 .menu .m.next {width:33px;}
	#popup1 .menu .m.prev {background-position:-230px -63px;}
	#popup1 .menu .m.next {background-position:-263px -63px;}
	#popup1 .menu .m.stop {background-position:-298px -63px}
	#popup1 .menu .m.play {background-position:-343px -63px}
}
@media all and (min-width:1000px){
	#popup1 {position:absolute;top:0;right:15px;margin:0;width:100%;height:300px;}
}
@media all and (min-width:1260px){
	#popup1 {right:0;}
}

/* mainbody3 */
#mainbody3 {background:#0ec1c8}
#mainbody3 .st1, #mainbody3 .st2 {color:#fff}
/* 체험프로그램 */
#expg1 {position:relative;}
#expg1 .datalist .item {border-radius:10px;background:#fff;overflow:hidden;margin-top:10px}
#expg1 .datalist .item:first-child {margin-left:0}
#expg1 .datalist.owl-loaded {padding-top:0}
#expg1 .datalist .owl-item .item {float:none;width:auto;margin:0}
#expg1 .datalist .owl-item .item a {display:block;}
#expg1 .datalist .f2 {position:relative;display:block;width:100%;height:0;padding-bottom:84.21%;overflow:hidden;}
#expg1 .datalist .f2 .f2p1 {position:absolute;top:0;bottom:0;left:-100%;right:-100%;overflow:hidden;}
#expg1 .datalist .f2 .f2p1 img {display:block;width:auto;height:100%;margin:auto;}
#expg1 .datalist .text1 {padding:20px 15px 25px 20px}
#expg1 .datalist .text1 .h1 {font-size:1em;line-height:1;}
#expg1 .datalist .text1 .h1 span {position:relative;display:block;}
#expg1 .datalist .text1 .h1 .cate {font-size:.875em;}
#expg1 .datalist .text1 .h1 .cate:after {position:absolute;bottom:-4px;left:0;content:"";display:block;width:50px;height:2px;}
#expg1 .datalist .text1 .h1 .t1 {font-size:1.5em;color:#000;margin:13px 0 18px}
#expg1 .datalist a:hover .text1 .h1 .t1, #expg1 .datalist a:focus .text1 .h1 .t1 {text-decoration:underline}
#expg1 .datalist>.item:nth-child(1) .text1 .h1 .cate, #expg1 .datalist .owl-item:nth-child(4n+1) .item .text1 .h1 .cate {color:#fd7c16;}
#expg1 .datalist>.item:nth-child(2) .text1 .h1 .cate, #expg1 .datalist .owl-item:nth-child(4n+2) .item .text1 .h1 .cate {color:#3bb04d;}
#expg1 .datalist>.item:nth-child(3) .text1 .h1 .cate, #expg1 .datalist .owl-item:nth-child(4n+3) .item .text1 .h1 .cate {color:#0091b6;}
#expg1 .datalist>.item:nth-child(4) .text1 .h1 .cate, #expg1 .datalist .owl-item:nth-child(4n+4) .item .text1 .h1 .cate {color:#e13959;}
#expg1 .datalist>.item:nth-child(1) .text1 .h1 .cate:after, #expg1 .datalist .owl-item:nth-child(4n+1) .item .text1 .h1 .cate:after {background-color:#fd7c16}
#expg1 .datalist>.item:nth-child(2) .text1 .h1 .cate:after, #expg1 .datalist .owl-item:nth-child(4n+2) .item .text1 .h1 .cate:after {background-color:#3bb04d}
#expg1 .datalist>.item:nth-child(3) .text1 .h1 .cate:after, #expg1 .datalist .owl-item:nth-child(4n+3) .item .text1 .h1 .cate:after {background-color:#0091b6}
#expg1 .datalist>.item:nth-child(4) .text1 .h1 .cate:after, #expg1 .datalist .owl-item:nth-child(4n+4) .item .text1 .h1 .cate:after {background-color:#e13959}

#expg1 .datalist .text1 ul li {position:relative;font-size:.938em;color:#777;margin:2px 0;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:2px 0 2px 26px;}
#expg1 .datalist .text1 ul li:before {position:absolute;top:2px;left:0;content:"";display:block;width:21px;height:20px;background:url(../../img/main/main_spr.png) no-repeat}
#expg1 .datalist .text1 ul li.n1:before {background-position:-383px 0}
#expg1 .datalist .text1 ul li.n2:before {top:1px;background-position:-360px 0}
#expg1 .menu {text-align:center;}
#expg1 .menu .goPage {display:none;vertical-align:top;margin:30px 0 0;text-align:center;}
#expg1 .menu .goPage .m {position:relative;display:inline-block;vertical-align:middle;width:18px;height:18px;transition:width .3s ease;text-indent:-9999em;}
#expg1 .menu .goPage .m.on {width:35px}
#expg1 .menu .goPage .m:before {position:absolute;top:calc(50% - 6px);left:calc(50% - 6px);content:"";display:block;width:12px;height:12px;background:#fff;border-radius:6px}
#expg1 .menu .goPage .m.on:before {background:#0d2154;width:35px;left:0;}
#expg1 .menu .prev, #expg1 .menu .next {position:absolute;top:calc(50% - 50px);width:51px;height:50px;background:url(../../img/main/main_spr.png) no-repeat;border:0;z-index:2}
#expg1 .menu .prev {left:-10px;background-position:-407px 0}
#expg1 .menu .next {right:-10px;background-position:-407px -52px}
@media all and (min-width:500px){
	#expg1 .datalist .item {float:left;width:calc(50% - 10px);margin-left:20px;margin-top:0}
	#expg1 .datalist .owl-stage-outer {padding-top:40px}
	#expg1 .datalist .owl-item:nth-child(odd) {margin-top:-40px}
}
@media all and (min-width:768px){
	#expg1 .menu .goPage {display:inline-block;}
}
@media all and (min-width:1000px){
	#expg1 .datalist .owl-stage-outer {padding-top:80px}
	#expg1 .datalist .owl-item:nth-child(odd) {margin-top:-80px}
	#expg1 .datalist .item {width:calc(25% - 15px);}
	#expg1 .datalist .f2 .f2p1 img {transition:all .4s ease}
	#expg1 .datalist .owl-item .item a:hover .f2 .f2p1 img {transform:scale(1.05);}
}
@media all and (min-width:1420px){
	#expg1 .menu .prev {left:-110px}
	#expg1 .menu .next {right:-110px}
}

/* mainbody4 */
#mainbody4:before, #mainbody4:after, #mainbody4 .container:before {position:absolute;content:"";display:block;background:url(../../img/main/main_spr.png) no-repeat}
#mainbody4:before {left:1%;bottom:0;background-position:-695px 0;width:218px;height:100px;}
#mainbody4:after {bottom:0;right:0;background-position:-461px 0;width:232px;height:98px;}
#mainbody4 .container:before {bottom:-70px;left:11.9%;width:125px;height:66px;background-position:-609px -115px}
/* 체험관안내 */
#menu2 {position:relative;overflow:hidden;z-index:2}
#menu2 li {margin-top:2%;}
#menu2 li a {position:relative;display:block;border-radius:9px;overflow:hidden;}
#menu2 li a img {width:100%;}
#menu2 li .t1 {position:absolute;bottom:20px;right:20px;z-index:2;color:#fff;font-size:1.25em;font-weight:600}
#menu2 li a:hover .t1, #menu2 li a:focus .t1 {text-decoration:underline;}
#menu2 li .t1:after {content:"";display:inline-block;vertical-align:middle;width:28px;height:28px;background:url(../../img/main/main_spr.png) no-repeat -328px -25px;margin-left:17px;margin-top:-2px}
@media all and (min-width:400px){
	#menu2 li {float:left;width:54%;margin-right:2%;margin-top:0}
	#menu2 li:nth-child(2) {width:44%;margin-right:0}
	#menu2 li:nth-child(3) {float:right;width:44%;margin-top:2%;margin-right:0}
	#menu2 li:last-child {margin-top:2%;width:100%;clear:both;}
}
@media all and (min-width:768px){
	#menu2 li, #menu2 li:nth-child(2) {width:32%;}
	#menu2 li:nth-child(3) {float:right;margin-right:0;width:32%;margin-top:0}
	#menu2 li:last-child {margin-right:0;margin-top:1.6667%;width:66%;clear:inherit}
}
@media all and (min-width:1000px){
	#menu2 li, #menu2 li:nth-child(2) {width:23.75%;margin-right:1.6667%}
	#menu2 li:nth-child(3) {position:absolute;width:23.75%;bottom:0;left:25.4167%;float:none;}
	#menu2 li:last-child {width:49.166%;margin-top:0}
	#menu2 li a img, #menu2 li .t1:after {transition:all .4s ease}
	#menu2 li a:hover img, #menu2 li a:focus img {transform:scale(1.03);}
	#menu2 li a:hover .t1:after, #menu2 li a:focus .t1:after {transform:rotate(90deg);}
}
@media all and (min-width:1260px){
	#mainbody4:before {left:6.25%;}
	#mainbody4:after {bottom:55px;right:4%}
}

/* mainbody5 */
#mainbody5 {background:#e0f4f8 url(../../img/main/mainbody5_bg.jpg) no-repeat 50% 0;background-size:cover;box-sizing:border-box;padding-top:40px}
#mainbody5 .st1 {color:#082a76;}
#mainbody5 .st2 {color:rgb(8,42,118,.69);line-height:1.333em}
#mainbody5 .ic1 {position:relative;display:block;width:298px;height:239px;background:url(../../img/main/main_spr.png) no-repeat -459px 0;margin:8.7% auto;background-size:auto 240px}
#mainbody5 .ic1:before {position:absolute;top:112px;left:73.2%;content:"";display:block;width:8px;height:12px;background:url(../../img/main/main_spr.png) no-repeat -440px -162px;background-size:auto 335px}
#menu3 {position:relative;text-align:center;margin-top:-160px}
#menu3 li {float:left;width:48%;margin-left:4%;margin-top:4%;}
#menu3 li:nth-child(odd) {margin-left:0}
#menu3 li a {display:block;background:#fff;font-size:1.063em;color:#0b3490;font-weight:600;padding:25px 0;box-sizing:border-box;border-radius:25px}
#menu3 li.n2 a {color:#fff;background:#006bc3;}
#menu3 li a:hover, #menu3 li a:focus {text-decoration:underline;}
#menu3 li a:before {content:"";display:block;width:53px;height:53px;background:url(../../img/main/main_spr.png) no-repeat;margin:0 auto 1%;background-size:auto 335px}
#menu3 li.n1 {margin-left:0}
#menu3 li.n4 {margin-right:0}
#menu3 li.n1 a:before {background-position:0 -37px}
#menu3 li.n2 a:before {background-position:-54px -37px}
#menu3 li.n3 a:before {background-position:0 -87px}
#menu3 li.n4 a:before {background-position:-54px -87px}
@media all and (min-width:500px){
	#mainbody5 .ic1 {width:417px;height:335px;background-size:auto 335px;background-position:-642px 0}
	#menu3 li, #menu3 li:nth-child(odd) {display:inline-block;vertical-align:top;float:none;width:calc(25% - 1.8%);margin-left:1%;margin-right:-.025em;margin-top:0}
	#menu3 li a {width:100%;height:0;padding-top:22%;padding-bottom:78%;margin:0 auto;border-radius:50%;}
}
@media all and (min-width:768px){
	#mainbody5 {padding-top:78px;height:860px}
	#mainbody5 .ic1 {width:596px;height:478px;background-size:auto;background-position:-917px 0;margin:75px auto 0;}
	#mainbody5 .ic1:before {top:23%;width:12px;height:17px;background-size:auto;background-position:-628px -231px}
	#menu3 li, #menu3 li:nth-child(odd) {margin-left:2%}
	#menu3 li a:before {width:75px;height:75px;background-size:auto;margin:0 auto 12px}
	#menu3 li.n1 a:before {background-position:0 -55px}
	#menu3 li.n2 a:before {background-position:-77px -55px}
	#menu3 li.n3 a:before {background-position:0 -127px}
	#menu3 li.n4 a:before {background-position:-77px -127px}
}
@media all and (min-width:1000px){
	#menu3 li, #menu3 li:nth-child(odd) {width:auto;margin:0 25px}
	#menu3 li a {width:200px;height:200px;padding:45px 0}
	#menu3 li a:hover:before, #menu3 li a:focus:before {animation:iacts_shake 1s ease-out;transform-origin:bottom;}
}
@media all and (min-width:1200px){
	#mainbody5 .ic1:before {top:2%;animation:iacts_tear 2s infinite;animation-timing-function:linear;}
}

@keyframes iacts_tear {
	0% {top:95px;opacity:0;transform:scale(0);animation-timing-function:ease;}
	25% {top:99px;opacity:.25;transform:scale(.25);}
	50% {top:104px;opacity:.5;transform:scale(.5);}
	75% {top:108px;opacity:.75;transform:scale(.75);}
	100% {top:112px;opacity:1;transform:scale(1);animation-timing-function:ease;}
}

@keyframes iacts_shake {
	0%,100% { transform:rotateZ(0deg);}
	10%, 30%, 50%, 70%, 90% { transform:rotateZ(-3deg);}
	20%, 40%, 60%, 80% { transform:rotateZ(3deg);}
}

