body{ color: #000000; }
#urunS img{ max-width: 100%; width: 100%; vertical-align: bottom; }

#urunS .box1{ position: relative; overflow: hidden; }
#urunS .box1 .box-box{ position: absolute;width: 40%; left: 14%; top: 30%; }
#urunS .box1 .box-box .bigSize{ font-size: 2.8vw; line-height: 3vw; }
#urunS .box1 .box-box .middleSize{ font-size: 2.2vw; line-height: 2.2vw; margin-top: 1%; }
#urunS .box1 .box-box .mt{ margin-top: 8%; }
#urunS .box1 .box-box .smallSize{ font-size: 1.4vw; line-height: 2.4vw; }
#urunS .box2{ overflow: hidden; background-color: #f9f9f9; }
#urunS .box2 ul{ width: 80%; margin: 4% auto; overflow: hidden; }
#urunS .box2 ul li{ width: 33.33%; float: left; text-align: center; }
#urunS .box2 ul li.mb{ margin-bottom: 4%; }
#urunS .box2 ul li img{ width: 14%; }
#urunS .box2 ul li .ss{ font-size: 1vw; line-height: 1.6vw; }
#urunS .bms{ font-size: 1.5vw; line-height: 2vw; }
#urunS .bbs{ font-size: 1.6vw; line-height: 2vw; margin: 0.5% 0px 3% 0px; }
#urunS .sss{ font-size: 1vw; line-height: 1.8vw; }
#urunS .box3 { overflow: hidden;padding-top: 4%; }
#urunS .box3 .box-box{ width: 74%; margin: 0% auto; }
#urunS .box3 .box-box img{ margin-top: 6% }
#urunS .box4 { overflow: hidden;padding-top: 4%; padding-bottom: 2%; }
#urunS .box4 .box-box{ width: 74%; margin: 0% auto; }
#urunS .box4 .box-box img{ margin-top: 6% }
#urunS .box4 .position{ position: relative; overflow: hidden; }
#urunS .box4 .sevenTen{ width: 56%; position: absolute; left: 1%; top: 20%; }
#urunS .box4 .sevenTen li{ float: left; width: 16.66%; text-align: center; margin-bottom: 3%; }
#urunS .box4 .sevenTen li img{ width: 50%; }
#urunS .box4 .sevenTen li .s{ font-size: 1vw; line-height: 1.6vw; margin-top: 4%; }
#urunS .box4 .three{ position: absolute; width: 40%; top: 76%; left: -1%; overflow: hidden; }
#urunS .box4 .three li{ float: left; width: 33.33%; height: 4vw; text-align: center; box-sizing: border-box;border-right: 1px solid #94b2aa; }
#urunS .box4 .three li .b{ font-size: 1.2vw; line-height: 1.8vw; }
#urunS .box4 .three li .s{ font-size: 0.8vw; line-height: 1.6vw; }
#urunS .box4 .three li:last-child{ border-right: 0px;line-height: 4vw; }
#urunS .box4 .three li:last-child .b{ line-height: 4vw; }
#urunS .box5{ overflow: hidden; background-color: #000000; padding: 4% 0px 0px 0px; }
#urunS .box5 .box-box{ width: 74%; margin: 0% auto; color: #ffffff; text-align: center; }
#urunS .box5 .position{ position: relative; overflow: hidden; padding:16% 0px; text-align: center; }
#urunS .box5 .position .bgText{ width: 90%; }
#urunS .box5 .position .uruns_left{ position: absolute; width: 26%; left: -50%; top: 18%;transition:all 0.5s linear; -moz-transition:all 0.5s linear; -webkit-transition:all 0.5s linear; -o-transition:all 0.5s linear; }
#urunS .box5 .position .uruns_right{ position: absolute; width: 28%; right: -50%; top: 18%; transition:all 0.5s linear; -moz-transition:all 0.5s linear; -webkit-transition:all 0.5s linear; -o-transition:all 0.5s linear;}
#urunS .box5 .position .uruns_left.activity{ left: 22%; }
#urunS .box5 .position .uruns_right.activity{ right: 22%; }
#urunS .box5 .position .green1{ width: 3%; position: absolute; right: 38.5%; top: 43.5%; opacity: 0; filter: alpha(opacity=0); transition:all 0.2s linear 0.5s; -moz-transition:all 0.2s linear 0.5s; -webkit-transition:all 0.2s linear 0.5s; -o-transition:all 0.2s linear 0.5s; }
#urunS .box5 .position .green2{ width: 3%; position: absolute; right: 39.5%; top: 49%; opacity: 0; filter: alpha(opacity=0); transition:all 0.2s linear 0.5s; -moz-transition:all 0.2s linear 0.5s; -webkit-transition:all 0.2s linear 0.5s; -o-transition:all 0.2s linear 0.5s; }
#urunS .box5 .position .red{ width: 4%; position: absolute; right: 36.5%; top: 43.5%; opacity: 0; filter: alpha(opacity=0); transition:all 0.2s linear 0.5s; -moz-transition:all 0.2s linear 0.5s; -webkit-transition:all 0.2s linear 0.5s; -o-transition:all 0.2s linear 0.5s; }
#urunS .box5 .position .tips{ font-size: 0.8vw; line-height: 1.4vw; position: absolute;text-align: center; width: 100%; left: 0%; bottom: 4%; color: #ffffff;  }
#urunS .box5 .position .green1.activity{ opacity: 1; filter: alpha(opacity=100); }
#urunS .box5 .position .green2.activity{ opacity: 1; filter: alpha(opacity=100); }
#urunS .box5 .position .red.activity{ opacity: 1; filter: alpha(opacity=100); }
#urunS .box6{ overflow: hidden; background-color: #f9f9f9; padding: 4% 0px;}
#urunS .box6 .box-box{ width: 74%; margin: 0% auto;  text-align: right; position: relative; overflow: hidden; }
#urunS .box6 .box-box .uruns-phone{ width: 46%;  }
#urunS .box6 .box-box .position{ width: 40%; left: 0%; top: 24%; position: absolute; text-align: left; }
#urunS .box6 .bbs{ margin: 1.5% 0px 5% 0px; }
#urunS .box6 .button{ color: #15337b;font-size: 1.4vw; line-height: 1.6vw; border-radius: 60px; background-color: #f1f1f1;
	display: inline-block; padding: 1vw 3vw; margin-top: 6%;
 }
#urunS .box6 .button img{ width: auto; height: 1.4vw; }
#urunS .box7{ overflow: hidden; padding: 4% 0px; text-align: center;}
#urunS .box7 .box-box{ width: 74%; margin: 0% auto; overflow: hidden; }
#urunS .box7 .box-box img{ margin-top: 6%; }
#urunS .box8 { position: relative; overflow: hidden; }
#urunS .box8 .uruns{ width: 50%; }
#urunS .box8 .box-box{ position: absolute; width: 40%; left: 50%; top: 20%;  }
#urunS .box8 .box-box table{ width: 100%; margin-top: 6%; }
#urunS .box8 .box-box table td{ border:1px solid #f9f9f9; border-collapse: collapse; padding: 1vw 0px; }
#urunS .box8 .box-box table .bb{ font-size: 1.4vw; line-height: 1.6vw; }
#urunS .box8 .box-box table .third{ font-size: 1.2vw; line-height: 2.4vw; }
#urunS .box8 .box-box table .ml{ border-left: 1px solid #f9f9f9; padding-left: 7%; }
#urunS .box8 .bbs{ margin: 1% 0px 5% 0px; }
#urunS .box9{ position: relative; overflow: hidden; }
#urunS .box9 .box-box{ width: 74%; margin: 0% auto; overflow: hidden; position: absolute; left: 13%; top: 10%; color: #ffffff; text-align: center; }
#urunS .box9 .bg{ margin-top: 4%; }
#urunS .box9 .bg2{ position: absolute;width: 22%; left: 41%; top: 34%; }
#urunS .box9 .icon{ position: absolute; width: 14%; text-align: center; color: #ffffff; }
#urunS .box9 .icon img{ width: 30%; }
#urunS .box9 .icon .ss{ font-size: 1vw; line-height: 1.4vw; }
#urunS .box9 .i1{ left: 28%; top: 42%; }
#urunS .box9 .i2{ left: 19%; top: 49%; }
#urunS .box9 .i3{ left: 25%; top: 62%; }
#urunS .box9 .i4{ left: 29%; top: 78%; }
#urunS .box9 .i5{ left: 71%; top: 43%; }
#urunS .box9 .i6{ left: 66%; top: 55%; }
#urunS .box9 .i7{ left: 72%; top: 70%; }
#urunS .box9 .i8{ left: 64%; top: 75%; }
@-webkit-keyframes circle1{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(20px) rotate(5deg);
	    transform: translateY(-20px) translateX(20px) rotate(5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle1{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(20px) rotate(5deg);
	    transform: translateY(-20px) translateX(20px) rotate(5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal1{ -webkit-animation: circle1 7s infinite linear; animation: circle1 7s infinite linear; }
@-webkit-keyframes circle2{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(20px) rotate(5deg);
	    transform: translateY(-20px) translateX(20px) rotate(5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle2{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(20px) rotate(5deg);
	    transform: translateY(-20px) translateX(20px) rotate(5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal2{ -webkit-animation: circle2 7s infinite linear; animation: circle2 7s infinite linear; }
@-webkit-keyframes circle3{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(10px) rotate(5deg);
	    transform: translateY(-20px) translateX(10px) rotate(5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle3{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(10px) rotate(5deg);
	    transform: translateY(-20px) translateX(10px) rotate(5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal3{ -webkit-animation: circle3 7s infinite linear; animation: circle3 7s infinite linear; }
@-webkit-keyframes circle4{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle4{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal4{ -webkit-animation: circle4 7s infinite linear; animation: circle4 7s infinite linear; }
@-webkit-keyframes circle5{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle5{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal5{ -webkit-animation: circle5 7s infinite linear; animation: circle5 7s infinite linear; }
@-webkit-keyframes circle6{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
@keyframes circle6{
   50%{ 
	   	-webkit-transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    transform: translateY(-20px) translateX(-10px) rotate(-5deg);
	    -webkit-animation-timing-function: ease-in-out;
	    animation-timing-function: ease-in-out;
   }
   100%{ 
   	-webkit-transform: translateY(0);
    transform: translateY(0);
   }
}
.animal6{ -webkit-animation: circle6 7s infinite linear; animation: circle6 7s infinite linear; }
#urunS .box10{ overflow: hidden; padding-bottom: 2%; position: relative; }
#urunS .box10 .bg{ width: 50%; padding-top: 6%; text-align: center; background-color: #ffd916;margin-top: 4%; position: relative; }
#urunS .box10 .bg .img1{ width: 36%; position: relative;z-index: 1; }
#urunS .box10 .bg .img2{ width: 18%; position: absolute; left: 60%; bottom: -2%;z-index: 2; }
#urunS .box10 .bg .img3{ width: 90%; position: absolute; left: 5%; top: 40%; z-index: 0; }
#urunS .box10 .box-box{ position: absolute; width: 30%; left: 55%; top: 40%; color: #000000; }
#urunS .box10 .bbs{ margin: 1% 0px 5% 0px; }
#urunS .box11{ position: relative; overflow: hidden; padding-top: 4%; }
#urunS .box11 .box-box{ margin: 0% auto; position: absolute; width: 40%; left: 13%; top: 37%; }
#urunS .box11 .bbs{ margin: 1% 0px 5% 0px; }
#urunS .box12{ overflow: hidden; text-align: center; padding: 4% 0px 2% 0px; }
#urunS .box12 .box-box{ width: 74%; margin: 0% auto;}
#urunS .box12 .box-box img{ margin-top: 4%; }