@charset "utf-8";

.mv_mousewheel {position:absolute;bottom:50px;left:50%;margin-left:-30px;width:60px;height:auto;z-index:99;transition: 0.3s;}
.mv_mousewheel img {width:100%;height:auto;}

.mv_mousewheel {

    -webkit-animation: spfactory1 .6s 1s infinite linear alternate;
    -moz-animation: spfactory1 .6s 1s infinite linear alternate;
    -ms-animation: spfactory1 .6s 1s infinite linear alternate;
    -o-animation: spfactory1 .6s 1s infinite linear alternate;
    animation: spfactory1 .6s 1s infinite linear alternate;


}

@keyframes spfactory1{
  from {
    opacity: .9;
	bottom:50px;
  }
  to {
    opacity: .2;
	bottom:30px;
  }
}


.mvisual	{width:100%;background-color:#333;height:auto;margin:0px;position:relative;}

/*
.mvisual .msbg01 {width:100%;min-height:600px;background: url("../img/main/ms01.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg02 {width:100%;min-height:600px;background: url("../img/main/ms02_01.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg03 {width:100%;min-height:600px;background: url("../img/main/ms03.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg04 {width:100%;min-height:600px;background: url("../img/main/ms04.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg01, 
.mvisual .msbg02, 
.mvisual .msbg03, 
.mvisual .msbg04, 
.mvisual .msbg05 {	animation:animate_background 7s ease;}
*/


.mvisual .msbg01 {width:100%;min-height:700px;background: url("../img/main/mv01.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg02 {width:100%;min-height:700px;background: url("../img/main/mv02.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg03 {width:100%;min-height:700px;background: url("../img/main/mv03_1.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg04 {width:100%;min-height:700px;background: url("../img/main/mv04.jpg") center top no-repeat;transition: 0.3s;}
.mvisual .msbg05 {width:100%;min-height:700px;background: url("../img/main/mv05.jpg") center top no-repeat;transition: 0.3s;}

.mvisual .msbg01,
.mvisual .msbg02,
.mvisual .msbg03,
.mvisual .msbg04,
.mvisual .msbg05 {background-attachment: fixed;}


.mvisual .carousel-caption		{max-width:1000px;width:100%;margin:0 auto;top:240px;
	animation: rotate01 0.6s linear 0.3s 1 alternate;transition: 0.3s;

}
.mvisual .carousel-caption .bar1 {display:block;width:100px;height:1px;background-color:#fff;overflow:hidden;margin-bottom:40px;}

.mvisual .carousel-caption h1	{

	font-weight:bold;
	text-align:left !important;
	font-size:40px;color:#fff;letter-spacing:-0.01em;
}
.mvisual .carousel-caption p		{
	text-align:left;
	margin-top:15px;
	font-size:20px;font-weight:400;color:#fff;letter-spacing:-0.05em;

}
@keyframes animate_background {0% {transform:scale(1.1)} 100% {transform:scale(1)}}
@keyframes rotate01 {
	0%   {opacity: 0.0; margin-top:30px;}
	100% {opacity: 1.0; margin-top:0px;}
}




.namepen {
    width: fit-content;
    padding: 0 0.25%;
    position: relative;
    z-index: 1;
}
.namepen::after {
    position: absolute;
    display: block;
    content: '\00a0';
    width: 100%;
    left: 0;
    right: 0;
    top: 50%;
    height: 60%;
    background-color: #fff1ae;
    transform: skew(-5deg);
    z-index: -1;
}

.service_p .service_p1						{list-style:none;margin:0px -10px;padding:0px;text-align:center;zoom:1}
.service_p .service_p1 						{*zoom:1;} /* IE5.5~7 브라우저 대응 Hack */
.service_p .service_p1:after				{content:"";display: block;height: 0;clear: both;visibility: hidden;}	
.service_p .service_p1 li					{float:left;padding-left:10px;padding-right:10px;margin:0px;box-sizing:border-box;} 
.service_p .service_p1 li					{width:calc(100%/3);} 
.service_p .service_p1 li					{letter-spacing:-0.05em;color:#888;font-size:14px;font-weight:400;line-height:1.4;}
.service_p .service_p1 li img				{width:100%;height:auto;transition: 0.3s;}
.service_p .service_p1 li .data1			{display:block;transition: 0.3s;padding:15px 0px 15px 0px;margin-bottom:20px;transition: 0.3s;border-top:1px solid #aaa;

	display:block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;

	transition: 0.3s;
} 
.service_p .service_p1 li em				{display:block;color:#333;margin:0px 0 0px 0;font-style:normal;font-size:18px;margin:0 0 8px 0;font-weight:900;letter-spacing: -0.07125em;transition: 0.3s;
	display:block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;

	transition: 0.3s;
}

.service_p .service_p1 li:hover .data1		{border-top:1px solid #ee3f4a;} 
.service_p .service_p1 li:hover .data1 em	{color:#ee3f4a;} 
.service_p .service_p1 li:hover img			{opacity:0.8;} 


.service_p .service_p1 li:nth-child(3n+1) {clear:both;}

.service_p .service_p2						{list-style:none;margin:0px -10px;padding:0px;text-align:center;zoom:1}
.service_p .service_p2 						{*zoom:1;} /* IE5.5~7 브라우저 대응 Hack */
.service_p .service_p2:after				{content:"";display: block;height: 0;clear: both;visibility: hidden;}	
.service_p .service_p2 li					{float:left;padding-left:10px;padding-right:10px;margin:0px;box-sizing:border-box;} 
.service_p .service_p2 li					{width:calc(100%/3);} 
.service_p .service_p2 li					{letter-spacing:-0.05em;color:#888;font-size:14px;font-weight:400;line-height:1.4;}
.service_p .service_p2 li img				{width:100%;height:auto;transition: 0.3s;}
.service_p .service_p2 li .data1			{display:block;transition: 0.3s;padding:15px 0px 15px 0px;margin-bottom:20px;transition: 0.3s;border-top:1px solid #aaa;
	display:block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;

	transition: 0.3s;
} 
.service_p .service_p2 li em				{display:block;color:#333;margin:0px 0 0px 0;font-style:normal;font-size:18px;margin:0 0 8px 0;font-weight:900;letter-spacing: -0.07125em;transition: 0.3s;
	display:block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;

	transition: 0.3s;
}

.service_p .service_p2 li:hover .data1		{border-top:1px solid #ee3f4a;} 
.service_p .service_p2 li:hover .data1 em	{color:#ee3f4a;} 
.service_p .service_p2 li:hover img			{opacity:0.8;} 


.service_p .service_p2 li:nth-child(3n+1) {clear:both;}









ul.tabs2			{margin:0px 0 20px 0;padding: 0px;list-style: none;border-bottom:1px solid #dedede;text-align:center;}
ul.tabs2 li			{background: none;color: #888; text-align:center;display: inline-block; padding: 15px 15px 15px 15px; cursor: pointer;font-size: 14px;font-weight: 500;letter-spacing: -0.05em;}
ul.tabs2 li.current	{color: #ee3f4a;font-weight: 700;border-radius:0px 0px 0 0;border-left:1px solid #dedede;border-right:1px solid #dedede;border-top:1px solid #dedede;border-bottom:1px solid #fff;background-color:#fff;margin-bottom:-1px;}



.tab-content		{display:none;padding:15px 0;}
.tab-content.current{display:inherit;}
.tab-content	{opacity:0;}














.maintitle1 {display:table;font-size:30px;font-weight:700;letter-spacing:-0.05em;color:#333;margin:0px 0 30px 0;}
.maintitle1 em {display:block;font-style:normal;font-weight:300;font-size:14px;color:#888;margin:5px 0 0px;padding-bottom:30px;border-bottom:1px solid #eee;}


.maintitle1_img1 {display:table;margin:0px auto 50px auto;width:120px;}
.maintitle1_img1 img {width:100%;height:auto;}


/* youtube */
lite-youtube {margin:0px auto;}


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

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


	.mvisual .msbg01,
	.mvisual .msbg02,
	.mvisual .msbg03,
	.mvisual .msbg04,
	.mvisual .msbg05 {min-height:600px;background-size:auto 775px;}



	.mvisual .carousel-caption		{max-width:70%;width:100%;margin:0 auto;top:200px;
		animation: rotate01 0.6s linear 0.3s 1 alternate;transition: 0.3s;

	}
	.mvisual .carousel-caption .bar1 {display:block;width:50px;height:1px;background-color:#fff;overflow:hidden;margin-bottom:40px;}

	.mvisual .carousel-caption h1	{

		font-weight:bold;
		text-align:left !important;
		font-size:24px;color:#fff;letter-spacing:-0.01em;
	}
	.mvisual .carousel-caption p		{
		text-align:left;
		margin-top:15px;
		font-size:15px;font-weight:400;color:#fff;letter-spacing:-0.05em;

	}

	.mv_mousewheel {position:absolute;bottom:50px;left:50%;margin-left:-30px;width:60px;height:auto;}
	.mv_mousewheel img {width:100%;height:auto;}

	ul.tabs2			{margin:0px 0 20px 0;padding: 0px;list-style: none;border-bottom:none;text-align:center;}
	ul.tabs2 li			{
		background: none;color: #888; text-align:center;display: inline-block;padding:7px 10px; cursor: pointer;font-size:12px;font-weight:500;letter-spacing:-0.05em;
		word-break:nowrap;
		background-color:#f6f6f6;margin-bottom:3px;border:1px solid #f6f6f6;border-radius:3px;
	
	}
	ul.tabs2 li.current	{color: #ee3f4a;font-weight: 700;border:1px solid #dedede;background-color:#fff;margin-bottom:0px;border-radius:3px;}




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

	.mvisual .msbg01,
	.mvisual .msbg02,
	.mvisual .msbg03,
	.mvisual .msbg04,
	.mvisual .msbg05 {min-height:520px;background-size:auto 648px;}



	.mvisual .carousel-caption		{max-width:70%;width:100%;margin:0 auto;top:160px;
		animation: rotate01 0.6s linear 0.3s 1 alternate;transition: 0.3s;

	}
	.mvisual .carousel-caption .bar1 {display:block;width:50px;height:1px;background-color:#fff;overflow:hidden;margin-bottom:40px;}

	.mvisual .carousel-caption h1	{

		font-weight:bold;
		text-align:left !important;
		font-size:24px;color:#fff;letter-spacing:-0.01em;
	}
	.mvisual .carousel-caption p		{
		text-align:left;
		margin-top:15px;
		font-size:15px;font-weight:400;color:#fff;letter-spacing:-0.05em;

	}


	.mv_mousewheel {position:absolute;bottom:10px;left:50%;margin-left:-15px;width:30px;height:auto;}
	.mv_mousewheel img {width:100%;height:auto;}


	.mv_mousewheel {

		-webkit-animation: spfactory1 .6s 1s infinite linear alternate;
		-moz-animation: spfactory1 .6s 1s infinite linear alternate;
		-ms-animation: spfactory1 .6s 1s infinite linear alternate;
		-o-animation: spfactory1 .6s 1s infinite linear alternate;
		animation: spfactory1 .6s 1s infinite linear alternate;


	}

	@keyframes spfactory1{
	  from {
		opacity: .9;
		bottom:30px;
	  }
	  to {
		opacity: .2;
		bottom:10px;
	  }
	}



/*

	ul.tabs2			{margin:0px 0 20px 0;padding: 0px;list-style: none;border-bottom:none;text-align:center;}
	ul.tabs2 li			{background: none;color: #888; text-align:center;display: inline-block; padding: 10px 5px 10px 5px; cursor: pointer;font-size: 14px;font-weight: 500;letter-spacing: -0.05em;}
	ul.tabs2 li.current	{color: #ee3f4a;font-weight: 700;border-radius:0px 0px 0 0;border-left:1px solid #dedede;border-right:1px solid #dedede;border-top:1px solid #dedede;border-bottom:1px solid #dedede;background-color:#fff;margin-bottom:0px;}
*/




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


	.mvisual .carousel-caption		{max-width:70%;width:100%;margin:0 auto;top:130px;
		animation: rotate01 0.6s linear 0.3s 1 alternate;transition: 0.3s;

	}
	.mvisual .carousel-caption .bar1 {display:block;width:50px;height:1px;background-color:#fff;overflow:hidden;margin-bottom:40px;}

	.mvisual .carousel-caption h1	{

		font-weight:bold;
		text-align:left !important;
		font-size:24px;color:#fff;letter-spacing:-0.01em;
	}
	.mvisual .carousel-caption p		{
		text-align:left;
		margin-top:15px;
		font-size:15px;font-weight:400;color:#fff;letter-spacing:-0.05em;

	}



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

	.mvisual .msbg01,
	.mvisual .msbg02,
	.mvisual .msbg03,
	.mvisual .msbg04,
	.mvisual .msbg05 {min-height:320px;background-size:auto 398px;}



	.mvisual .carousel-caption		{max-width:80%;width:100%;margin:0 auto;top:60px;
		animation: rotate01 0.6s linear 0.3s 1 alternate;transition: 0.3s;

	}
	.mvisual .carousel-caption .bar1 {display:block;width:50px;height:1px;background-color:#fff;overflow:hidden;margin-bottom:40px;}

	.mvisual .carousel-caption h1	{

		font-weight:bold;
		text-align:left !important;
		font-size:24px;color:#fff;letter-spacing:-0.01em;
	}
	.mvisual .carousel-caption p		{
		text-align:left;
		margin-top:15px;
		font-size:15px;font-weight:400;color:#fff;letter-spacing:-0.05em;

	}


	.maintitle1 {display:table;font-size:24px;font-weight:700;letter-spacing:-0.05em;color:#333;margin:0px 0 30px 0;}
	.maintitle1 em {display:block;font-style:normal;font-weight:300;font-size:14px;color:#888;margin:5px 0 0px;padding-bottom:30px;border-bottom:1px solid #eee;}


	.maintitle1_img1 {display:table;margin:0px auto 30px auto;width:90px;}
	.maintitle1_img1 img {width:100%;height:auto;}


	.service_p .service_p1 li					{width:calc(100%/2);} 
	.service_p .service_p1 li:nth-child(3n+1)	{clear:none;}
	.service_p .service_p1 li:nth-child(2n+1)	{clear:both;}

	.service_p .service_p2 li					{width:calc(100%/1);} 
	.service_p .service_p2 li:nth-child(3n+1)	{clear:none;}
	.service_p .service_p2 li:nth-child(2n+1)	{clear:none;}

	.youtube_b1 {padding:0px;}

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




}