﻿@charset "utf-8";
/* @charset "euc-kr"; */
#bnSubArea {position: relative; width: 100%; height: 400px; background: url('../img/sbn01.jpg') center center no-repeat; background-size: cover; overflow: hidden; transition: all 0.3s;}

#bnSubArea > .sbn {width: 100%; max-width: 1200px; height: 100%; box-sizing: border-box; padding: 170px 0 130px; margin: 0 auto; background-color: rgba(0,0,0,0.0); transition: all 0.3s}
#bnSubArea > .sbn > h2 {line-height: 40px; font-size: 32px; font-weight: 500; color: #fff; text-align: center; transition: all 0.3s}
#bnSubArea > .sbn > h3 {line-height: 60px; font-size: 58px; font-weight: 500; color: #fff; text-align: center; transition: all 0.3s}
#bnSubArea > .sbn > * {text-shadow: 0 0 3px #666;}

#bnSubArea > .subPageing {position: absolute; top: 210px; left: 0; width: 100%; height: 60px; z-index: 1; transition: all 0.3s;}
#bnSubArea > .subPageing > .pageLink {position: absolute; top: 0; display: block; width: 40px; height: 60px;}
#bnSubArea > .subPageing > .pageLink > a {display: block; width: 100%; height: 100%; transition: all 0.3s;}
#bnSubArea > .subPageing > .pageLink > a.btNext {border-radius: 25px 0 0 25px; background: url('../img/btNext.png') left -5px center no-repeat; background-color: rgba(0,0,0,0.2);}
#bnSubArea > .subPageing > .pageLink > a.btPrev {border-radius: 0 25px 25px 0; background: url('../img/btPrev.png') right -5px center no-repeat; background-color: rgba(0,0,0,0.2);}
#bnSubArea > .subPageing > .pageLink > a:hover {background-color: rgba(0,0,0,0.6); transition: all 0.3s;}
#bnSubArea > .subPageing > .prev {left: 0;}
#bnSubArea > .subPageing > .next {right: 0;}

@media screen and (max-width: 980px) {
	#bnSubArea {height: 340px;}
	#bnSubArea > .sbn {padding: 130px 0 70px;}
	#bnSubArea > .sbn > h2 {line-height: 30px; font-size: 26px;}
	#bnSubArea > .sbn > h3 {line-height: 50px; font-size: 46px;}
	#bnSubArea > .subPageing {top: 160px; height: 50px;}
	#bnSubArea > .subPageing > .pageLink {width: 30px; height: 50px;}
	#bnSubArea > .subPageing > .pageLink > a.btNext {border-radius: 20px 0 0 20px; background-position: left -12px center;}
	#bnSubArea > .subPageing > .pageLink > a.btPrev {border-radius: 0 20px 20px 0; background-position: right -12px center;}
}

@media screen and (max-width: 660px) {
	#bnSubArea {height: 180px;}
	#bnSubArea > .subPageing {top: 110px; height: 50px;}
	#bnSubArea > .sbn {padding: 80px 0 20px; background-color: rgba(72,79,90,0.6);}
	#bnSubArea > .sbn > h2 {line-height: 30px; font-size: 26px; font-weight: 500;}
	#bnSubArea > .sbn > h3 {line-height: 50px; font-size: 38px; font-weight: 500;}
}

#subHeader {position: absolute; top: 340px; left: 0; width: 100%; height: 60px; transition: all 0.3s;}
#subHeader .subHeaderFix {width: 100%; height: 60px; z-index: 100; border-radius: 0; overflow: visible;}

#subHeader .subMenuArea {
	width: 100%; max-width: 1200px; min-width: 320px; height: 60px; margin: 0 auto;
	background-color: rgba(85,100,112,0.60);
	box-shadow: 0 0px 0px 0px #bbb;
	transition: all 0.3s;
}
#subHeader .subMenuArea .subMenuNavi {width: 100%; height: 60px; margin: 0 auto;}
#subHeader .subMenuArea .subMenuNavi>li {float: left;}
#subHeader .subMenuArea .subMenuNavi>li > a {width: 100%; height: 60px; display: block; text-align: center; font-size: 18px; line-height: 60px; font-weight: 500; color: #bbb; text-decoration: none; transition: all 0.3s;}
#subHeader .subMenuArea .subMenuNavi>li a:hover {color: #fff;}
#subHeader .subMenuArea .subMenuNavi>li.on,
#subHeader .subMenuArea .subMenuNavi>li.on>a {color: #fff; background-color: #009a9d;}
#subHeader .subMenuArea .subMenuNavi>li a:hover {color: #fff; background-color: #394247;}
#subHeader .subMenuArea .subMenuNavi>li.on > a:hover {color: #fff; background-color: #076ac6;}

#subHeader .subMenuArea .subMenuNavi.tab1>li {width: 50%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab2>li {width: 50%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab3>li {width: 33%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab3>li:nth-child(2) {width: 34%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab4>li {width: 25%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab5>li {width: 20%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab6>li {width: 16.5%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab6>li:nth-child(2),
#subHeader .subMenuArea .subMenuNavi.tab6>li:nth-child(5) {width: 17%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab7>li {width: 14%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab7>li:nth-child(1),
#subHeader .subMenuArea .subMenuNavi.tab7>li:nth-child(7) {width: 15%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab8>li {width: 12%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab8>li:nth-child(odd) {width: 13%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab9>li {width: 11%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab10>li {width: 10%; height: 60px; border-left: none;}
#subHeader .subMenuArea .subMenuNavi.tab6>li:nth-child(1),
#subHeader .subMenuArea .subMenuNavi.tab6>li:nth-child(9) {width: 11.5%; height: 60px; border-left: none;}

@media screen and (max-width: 1220px) {
	#subHeader .subMenuArea {max-width: 960px;}
	#subHeader .subMenuArea .subMenuNavi>li > a {font-size: 16px;}
}
@media screen and (max-width: 980px) {
	#subHeader {top: 280px;}
	#subHeader .subMenuArea {max-width: none;}
	#subHeader .subMenuArea .subMenuNavi>li> a {font-size: 16px;}
}
@media screen and (max-width: 660px) {
	#subHeader,
	#subHeader .subHeaderFix,
	#subHeader .subMenuArea {
	  animation-name: slideHidden;
	  -webkit-animation-name: slideHidden;
	  animation-duration: 1.0s;
	  -webkit-animation-duration: 1.0s;
	  visibility: hidden;
	}
	@keyframes slideHidden{
		0% {
		  opacity: 1;
		  transform: translateY(0%);
		} 
		100% {
		  opacity: 0;
		  transform: translateY(70%);
		}
	}
	@-webkit-keyframes slideHidden{
		0% {
		  opacity: 1;
		  -webkit-transform: translateY(0%);
		} 
		100% {
		  opacity: 0;
		  -webkit-transform: translateY(70%);
		}
	}
}


#subContainer {width: 100%; min-height: 600px; padding: 0 0 0px; background-color: #fff;}

	/* Table Sub Style Start */
	table.subTable01 {table-layout: fixed; width: 100%; margin: 0 auto; padding: 0; border-collapse: collapse; border-top: 2px solid #444; border-bottom: 1px solid #777 !important;}
	table.subTable01 th,
	table.subTable01 td {font-size: 15px; font-weight: 300; color: #222; padding: 15px; border: 1px solid #ddd;}
	table.subTable01 th {font-weight: 500;}
	table.subTable01 tr:first-child th {border-top: 0;}
	table.subTable01 tr:last-child th,
	table.subTable01 tr td:first-child,
	table.subTable01 tr th:first-child {border-left: 0;}
	table.subTable01 tr td:last-child,
	table.subTable01 tr th:last-child {border-right: 0;}

	table.subTable01 tr td.endTd,
	table.subTable01 tr:last-child th,
	table.subTable01 tr:last-child td {border-bottom: 0;}
	/* Table Base Style End */


	.cBoxArea {width: 100%; max-width: 1200px; min-height: 600px; margin: 0 auto; box-sizing: border-box; padding: 0; background-color: #fff; border-radius: 0; transition: all 0.3s;}

	@media screen and (max-width: 1220px) {
		.cBoxArea {max-width: 960px; transition: all 0.3s;}
	}
	@media screen and (max-width: 980px) {
		.cBoxArea {max-width: none; padding: 0 10px; transition: all 0.3s;}
	}

	.subTitleArea {width: 100%; height: 120px; padding-top: 40px;}

	.subTitleArea > ul.whereIs {width: 100%; height: 40px; text-align: center; padding: 0; background-color: #fff; transition: all 0.3s;}
	.subTitleArea > ul.whereIs > li {position: relative; display: inline-block; height: 40px;  box-sizing: border-box; padding: 0 25px 0 5px; line-height: 40px; font-size: 14px; color: #999; border: 0; background: url('../img/iconWhereis.png') right center no-repeat; text-decoration: none; transition: all 0.3s;}
	.subTitleArea > ul.whereIs > li:nth-child(1) > a {position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
	.subTitleArea > ul.whereIs > li:last-child {background: none; padding: 0 5px 0 5px;}

	.subTitleArea > ul.whereIs > li > .depthMenu {position: absolute; display: none; top: 0; left: 0; right: auto; width: 140px; height: auto; min-height: 40px; max-height: 460px; border-top: 0px #777 solid; background-color: rgba(250,250,250,0.96); box-shadow: 1px 1px 3px 1px #999; z-index: 100;}
	.subTitleArea > ul.whereIs > li > .depthMenu > li {width: 100%; height: 40px; transition: all 0.3s;}
	.subTitleArea > ul.whereIs > li > .depthMenu > li > a {display: block; width: 100%; height: 40px; box-sizing: border-box; padding: 5px 20px 4px; line-height: 30px; font-size: 13px; font-weight: 300; color: #666; text-align: left; text-decoration: none; transition: all 0.3s;}
	.subTitleArea > ul.whereIs > li > .depthMenu > li:hover {background-color: rgba(0,0,0,0.1);}
	.subTitleArea > ul.whereIs > li > .depthMenu > li.on {background-color: #4e575c; background-color: rgba(78,87,92,0.96);}
	.subTitleArea > ul.whereIs > li > .depthMenu > li.on > a {color: #fff;}
	.subTitleArea > ul.whereIs > li > .depthMenu > li.on:hover {background-color: rgba(0,0,0,0.9);}
	.subTitleArea > h3 {width: 100%; height: 60px; box-sizing: border-box; font-size: 42px; font-weight: 400; color: #111; line-height: 50px; text-align: center; letter-spacing: -1px; padding-bottom: 9px; border-bottom: 1px #eee solid;}

	@media screen and (max-width: 660px) {
		.subTitleArea {padding-top: 0;}
		.subTitleArea > ul.whereIs {width: 100%; height: 40px; background-color: #4e575c;}
		.subTitleArea > ul.whereIs > li,
		.subTitleArea > ul.whereIs > li:last-child {float: left;  display: block; width: 110px; height: 40px; box-sizing: border-box; padding: 10px; line-height: 20px; font-size: 13px; font-weight: 300; color: #ddd; text-align: left; background: url('../img/iconWhereisDown.png') right center no-repeat; background-color: #646e74;}
		.subTitleArea > ul.whereIs > li:nth-child(1) {width: 80px; padding-left: 30px; background: url('../img/icon_home.png') 12px center no-repeat; background-size: 10px; background-color: #394247;}
		.subTitleArea > ul.whereIs > li:hover {color: #ddd; background-color: rgba(0,0,0,0.3);}
		.subTitleArea > h3 {height: 80px; padding-top: 20px; font-size: 36px;}
	}
	@media screen and (max-width: 360px) {
		.subTitleArea > ul.whereIs > li:last-child > .depthMenu {left: auto; right: 0;}
	}

	.cBox {position: relative; width: 100%; min-height: 200px; padding: 60px 0; margin: 0;}

	.cBox .cBoxLine {display: block; width: 200px; height: 59px; font-size: 59px; line-height: 59px; box-sizing: border-box; border-bottom: 1px #bbb dashed; margin: 0 auto;}
	.cBox:last-child .cBoxLine {height: 60px; font-size: 60px; line-height: 60px; border-bottom: 0;}

	.cBox h4 {line-height: 40px; font-size: 30px; padding: 30px 0 20px 0; font-weight: 500; text-align: center;}
	.cBox h5 {margin-bottom: 10px; line-height: 40px; font-size: 24px; padding: 30px 0 7px; font-weight: 500; text-align: center; border-bottom: 1px solid #009a9d; text-align: left; color: #009a9d;}
	.cBox h6 {line-height: 30px; font-size: 16px; padding: 0; font-weight: 500; text-align: left;  margin-top: 10px; background:url('../img/bullet01.gif') no-repeat left 10px; }
	.cBox h4:first-child,
	.cBox h5:first-child,
	.cBox h6:first-child {padding-top: 0;}

		ul.tabMenuArea {width: 100%; height: 50px; box-sizing: border-box; border-bottom: 1px #999 solid; margin-top: 40px;}
		ul.tabMenuArea > li {float: left; display: block; width: 160px; height: 49px; background-color: #b5bbc6; overflow: hidden; transition: all 0.3s;}
		ul.tabMenuArea > li:first-child {border-radius: 0 0 0 0;}
		ul.tabMenuArea > li:last-child {border-radius: 0 0 0 0;}
		ul.tabMenuArea > li > a {display: block; width: 100%; height: 49px; line-height: 49px; font-size: 14px; font-weight: 500; color: #fff; text-align: center; text-decoration: none;}
		ul.tabMenuArea > li:hover {background-color: #7e889b; transition: all 0.3s;}
		ul.tabMenuArea > li.on {background-color: #415e94; transition: all 0.3s;}
		ul.tabMenuArea > li.on:hover {background-color: #000; transition: all 0.3s;}
		.tabMenuArea.tab1 > li {width: 100%;}
		.tabMenuArea.tab2 > li {width: 50%;}
		.tabMenuArea.tab3 > li {width: 33%;}
		.tabMenuArea.tab3 > li:nth-child(2) {width: 34%;}
		.tabMenuArea.tab4 > li {width: 25%;}
		.tabMenuArea.tab5 > li {width: 20%;}
		.tabMenuArea.tab6 > li {width: 16.5%;}
		.tabMenuArea.tab6 > li:nth-child(2),
		.tabMenuArea.tab6 > li:nth-child(5) {width: 17%;}
		.tabMenuArea.tab7 > li:nth-child(odd) {width: 14.5%;}
		.tabMenuArea.tab7 > li:nth-child(even) {width: 14%;}
		.tabMenuArea.tab8 > li {width: 12.5px;}

	/* for sub page start */
	.module {position: relative; clear: both; width: 100%; margin-bottom: 60px; word-break: keep-all;}

	.module .mType01 > .mBox {position: relative; float: left; width: 100%; margin: 0; padding: 0;}
	.module .mType02 > .mBox {position: relative; float: left; width: 50%; margin: 0; padding: 0;}
	.module .mType03 > .mBox {position: relative; float: left; width: 33.33%; margin: 0; padding: 0;}
	.module .mType04 > .mBox {position: relative; float: left; width: 25%; margin: 0; padding: 0;}

		.mBox .mBg {position: relative; width: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover;}
		.mBox .mImg {position: relative; width: 100%;}
		.mBox .mImg > img {display: block; float: left; width: 100%;}

		.mBox .mText {position: relative; width: 100%; max-width: 1200px; box-sizing: border-box;  margin: 0 auto;}
		.mBox .mImgAdd {padding: 30px;}
		.mBox .mText .engTitle {line-height: 30px; font-size: 28px; font-weight: bold; color: #999; text-align: center;  margin-top: 50px; }
		.mBox .mText p {line-height: 1.6em; font-size: 16px; font-weight: 300; text-align: left; padding: 15px 0; color: #111; transition: all 0.3s;}
		.mBox .mText p.small {line-height: 20px; font-size: 13px; color: #999;}
		.mBox .mText .parGroup {padding: 30px 0;}
		.mBox .mText .parGroup .paragraph {padding: 10px 0;}

	.module .mBox .subPageLogo {margin: 0 auto; width: 200px;}
	/* for sub page end */

	/* for about01 start */
	#about01Wrap {}
	#about01Wrap .module {max-width: 960px; margin: 0 auto; }
	#about01Wrap p.welcome01 {display: block; width: 100%; height: auto; box-sizing: border-box; padding: 29px; border: 1px #eee solid; line-height: 40px; font-size: 28px; font-weight: 300; text-align: center; color: #009a9d; }
	#about01Wrap p.welcome02 {margin-top: 40px; line-height: 30px; font-size: 24px; font-weight: 500; text-align: center; padding: 10px 0; color: #222;}
	#about01Wrap p.welcome03 {display: block; max-width: 700px; margin: 0 auto; line-height: 30px; font-size: 16px; font-weight: 300; text-align: center; padding: 10px 0; color: #444;}
	#about01Wrap p strong {color: #009a9d; font-weight: 500; text-decoration: underline;}
	#about01Wrap p.ceo {line-height: 40px; font-size: 16px; color: #777; text-align: center; margin-top: 60px;}
	#about01Wrap p.ceo > span {font-size: 24px; font-weight: 500; color: #222; font-family: 나눔명조, 바탕;}

	@media screen and (max-width: 660px) {
		#about01Wrap p.welcome01 {padding: 19px; line-height: 30px; font-size: 24px;}
		#about01Wrap p.welcome02 {line-height: 25px; font-size: 20px;}
		#about01Wrap p.welcome03 {max-width: 500px; line-height: 25px; font-size: 14px;}
	}
	/* for about01 end */

    /* for about02 start */
    #about02Wrap {}
	.about02Section01 {}
	.about02Section01 .mType01 {width: 100%; max-width: 1200px; margin: 0 auto; }

	.about02Section01 ul.patentList {display: block; width: 100%; font-size: 0; text-align: center; transition: all 0.3s;}
	.about02Section01 ul.patentList > li {display: inline-block; width: 20%; box-sizing: border-box; padding: 20px 10px; transition: all 0.3s;}
	.about02Section01 ul.patentList > li > ul {display: block; width: 100%; height: 100%;}
	.about02Section01 ul.patentList > li > ul > li.pic {display: block; width: 100%; height: auto; box-sizing: border-box; border: 0px #eee solid; box-shadow: 0px 0px 3px 0 #ccc; border-radius: 8px; background-color: #f9f9f9; overflow: hidden; transition: all 0.3s;}
	.about02Section01 ul.patentList > li > ul > li.pic > img {float: left; width: 100%; height: auto; transition: all 0.3s;}
	.about02Section01 ul.patentList > li > ul > li.title {display: block; width: 100%; height: 60px; line-height: 20px; padding: 10px 0 0; font-size: 14px; font-weight: 500; color: #222; text-align: center;}
	.about02Section01 ul.patentList > li > ul > li.title > span {font-size: 12px; font-weight: 300; color: #4D72C5;}
	.about02Section01 ul.patentList > li > ul > li.regdate {display: none; width: 100%; height: 20px; line-height: 20px; padding: 0 0 10px; font-size: 12px; font-weight: 300; color: #777; text-align: center;}
	.about02Section01 ul.patentList > li:hover > ul > li.pic {box-shadow: 2px 2px 10px 0 #999;}
	@media screen and (max-width: 980px) {
		.about02Section01 ul.patentList > li {width: 25%;}
		.about02Section01 ul.patentList > li > ul > li.title {font-size: 13px;}
	}
	@media screen and (max-width: 660px) {
		.about02Section01 ul.patentList > li {width: 33.33%;}
	}
	@media screen and (max-width: 500px) {
		.about02Section01 ul.patentList > li {width: 50%;}
    }
    /* for about02 end */
        
	/* for about03 start */
	#about03Wrap {}
    #about03Wrap .contactInfo {width: 100%; padding-top: 40px;}

    .contactInfo > ul {height: auto; padding-bottom: 40px;}
    .contactInfo > ul > li {min-height: 130px; padding-bottom: 20px;}
    .contactInfo > ul > li > dl {width: 100%; height: 60px; padding: 70px 0 0px 0;}
    .contactInfo > ul > li > dl.addr {height: 140px; background: url('../img/iconContactAddress.png') center top no-repeat;}
    .contactInfo > ul > li > dl.phone {height: 130px; background: url('../img/iconContactPhone.png') center top no-repeat;}
    .contactInfo > ul > li > dl.email {background: url('../img/iconContactEmail.png') center top no-repeat;}
    .contactInfo > ul > li > dl.download {background: url('../img/iconContactDownload.png') left center no-repeat;}
    .contactInfo > ul > li > dl > dt {line-height: 30px; font-size: 18px; font-weight: bold; color: #bbb; text-align: center;}
    .contactInfo > ul > li > dl > dd {line-height: 30px; font-size: 16px; font-weight: 400; color: #222; text-align: center;}
    .contactInfo > ul > li > dl > dd.famliyCompany {line-height: 40px; color: #00b4b7;}
    .contactInfo > ul > li > dl > dd.famliyCompany > span {padding: 0 10px; color: #ddd; font-size: 10px;}

    .contactInfo > a {display: block; width: 200px; height: 40px; margin: 0 auto; line-height: 40px; font-size: 14px; font-weight: bold; color: #fff; text-align: center; background-color: #444; transition: all 0.3s;}
    .contactInfo > a:hover {background-color: #000; transition: all 0.3s;}

	#about03Wrap .mapResponse {position: relative; width: 100%; height: 300px; margin: 0 auto; padding: 0; -webkit-filter: grayscale(40%); overflow: hidden;}

	@media screen and (max-width: 480px) {
	    .contactInfo > ul > li {min-height: 130px;}
	    .contactInfo > ul > li > dl {height: 60px;}
	    .contactInfo > ul > li > dl.addr {height: 120px;}
		.contactInfo > ul > li > dl > dd.famliyCompany {line-height: 30px;}
	    .contactInfo > ul > li > dl > dt {line-height: 30px; font-size: 15px;}
	    .contactInfo > ul > li > dl > dd {line-height: 30px; font-size: 13px;}
	
	}
	/* for about03 end */

	

	/* for business01 start */
	#business01Wrap {}
	#business01Wrap ul.b01 {width: 100%;}
		ul.b01 > li {float: left; display: block; margin-top: 20px; width: 33.33%; min-height: 100px; box-sizing: border-box; padding: 0 5px; transition: all 0.3s;}
		ul.b01 > li > dl {width: 100%;}
		ul.b01 > li > dl > dt {width: 100%; height: 20px; line-height: 20px; font-size: 14px; font-weight: 500; color: #777; text-align: center; padding: 10px 0 20px;}
		ul.b01 > li > dl > dd {display: block; width: 100%; height: 190px;  background-position: center center; background-size: cover; background-color: #eee; overflow: hidden; border-radius: 0;}
	#business01Wrap .mBox .mText p.b01articleBold {
		background: linear-gradient(to right, #8cd400 30%, #43ffd5 50%, #1c69c9 80%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		margin-top: 20px; width: 100%; height: 60px; line-height: 60px; font-size: 48px; font-weight: 800; color: #009a9d; text-align: center; padding: 0;}
	@media all and (-ms-high-contrast: none),
	(-ms-high-contrast: active) {
	    /* IE10+ CSS styles go here */
	    #business01Wrap .mBox .mText p.b01articleBold {
			font-weight: 700;
	        color: #009a9d;
	        text-shadow: 1px 1px 3px #999;
	        background: transparent;
	    }
	}
	#business01Wrap .mBox .mText p.b01articleSmall  {width: 100%; height: 40px; line-height: 40px; font-size: 18px; font-weight: 500; color: #222; text-align: center; padding: 0;}

	#business01Wrap ul.b01Process {width: 100%; box-sizing: border-box; padding: 19px; border: 1px #eee solid; background-color: #f9f9f9;}
	#business01Wrap ul.b01Process > li {float: left; display: block; width: 25%; height: 120px; box-sizing: border-box; padding: 10px;}
	#business01Wrap ul.b01Process > li > dl {display: block; width: 100%; height: 100%; box-sizing: border-box; padding: 27px 10px 30px; border-top: 3px #00c7cb solid; border-bottom: 3px #bbb solid; border-radius: 0 20px 0 20px; background: #eee; transition: all 0.3s;}
	#business01Wrap ul.b01Process > li > dl > dt {width: 100%; height: 20px; line-height: 20px; font-size: 16px; font-weight: 500; color: #222; text-align: center;}
	#business01Wrap ul.b01Process > li > dl > dd {width: 100%; height: 20px; line-height: 20px; font-size: 13px; font-weight: 400; color: #777; text-align: center;}
	#business01Wrap ul.b01Process > li > dl > dd.active {font-size: 18px; font-weight: 400; color: #009a9d;}
	#business01Wrap ul.b01Process > li:hover > dl {border-top: 3px #00819d solid; border-bottom: 3px #ddd solid; background: #009a9d;}
	#business01Wrap ul.b01Process > li:hover > dl > dt {color: #fff;}
	#business01Wrap ul.b01Process > li:hover > dl > dd {color: #aad7d8;}

	@media screen and (max-width: 820px) {
		#business01Wrap .mBox .mText p.b01articleBold {height: 60px; line-height: 60px; font-size: 42px;}
		#business01Wrap .mBox .mText p.b01articleSmall {height: auto; line-height: 30px; font-size: 16px;}
		#business01Wrap ul.b01Process > li {width: 33.33%;}
    }
	@media screen and (max-width: 660px) {
		#business01Wrap .mBox .mText p.b01articleBold {height: 50px; line-height: 50px; font-size: 37px;}
		#business01Wrap .mBox .mText p.b01articleSmall {height: auto; line-height: 20px; font-size: 16px;}
		#business01Wrap ul.b01Process {padding: 9px;}
		#business01Wrap ul.b01Process > li {width: 50%;}
    }
	/* for business01 end */


	/* for business02 start */
	#business02Wrap ul.article {position: relative; width: 100%; box-sizing: border-box; padding: 20px; background-color: #f9f9f9;}
	#business02Wrap ul.article > li {float: left; width: 25%; box-sizing: border-box; padding: 10px;}
	#business02Wrap ul.article > li > h6 {
		background: linear-gradient(45deg, #00b7bb 25%, #1c69c9 90%); /*#8cd400 2%, */
		width: 100%; height: 60px; box-sizing: border-box; padding: 10px; line-height: 40px; font-size: 17px; font-weight: 500; color: #fff; text-shadow: 1px 1px 2px #999; background-color: #00819d;
	}
		
	#business02Wrap ul.article > li > h6 > span {font-size: 28px; font-weight: 200;}
	#business02Wrap ul.article > li > ul {margin-top: 10px; display: block; width: 100%; height: 120px; box-sizing: border-box; padding: 19px; border: 1px #eee solid; background-color: #fff;}
	#business02Wrap ul.article > li > ul > li {list-style: disc inside; width: 100%; height: 25px; line-height: 25px; font-size: 15px; font-weight: 400; color: #222;}

	@media screen and (max-width: 1220px) {
		#business02Wrap ul.article > li {width: 33.33%;}
		#business02Wrap ul.article > li > h6 {font-size: 15px;}
		#business02Wrap ul.article > li > h6 > span {font-size: 24px;}
		#business02Wrap ul.article > li > ul > li {height: 20px; line-height: 20px; font-size: 13px;}
	}
	@media screen and (max-width: 820px) {
		#business02Wrap ul.article {padding: 0px;}
		#business02Wrap ul.article > li {width: 50%;}
		#business02Wrap ul.article > li > h6 {height: 40px; line-height: 20px; font-size: 14px;}
		#business02Wrap ul.article > li > h6 > span {font-size: 18px;}
	}
	@media screen and (max-width: 480px) {
		#business02Wrap ul.article {padding: 20px;}
		#business02Wrap ul.article > li {width: 100%;}
	}

	#business02Wrap .math {width: 100%; box-sizing: border-box; padding: 60px; border: 1px #ddd solid; background-color: #f9f9f9;}
	#business02Wrap .math > .baseFrmula {width: 100%; height: 40px; line-height: 40px; font-size: 36px; font-weight: 800; color: #999; text-align: center; padding: 0;}
	#business02Wrap .math > .baseFrmula > span.t01 {color: #80bb00; font-weight: 800;}
	#business02Wrap .math > .baseFrmula > span.t02 {color: #009a9d; font-weight: 700;}
	#business02Wrap .math > .baseFrmula > span.t03 {color: #1c69c9; font-weight: 700;}
	#business02Wrap .math > .baseFrmula sup {font-size: 18px;}
	
	#business02Wrap ul.cal {display: block; margin: 60px auto 0; width: 800px; box-sizing: border-box; border-top: 1px #ddd solid; padding: 39px;}
	#business02Wrap ul.cal > li {width: 100%; font-size: 18px; font-weight: 400; color: #111; padding-bottom: 40px;}
	#business02Wrap ul.cal > li:last-child {padding-bottom: 0;}
	#business02Wrap ul.cal > li strong {text-decoration: underline;}
	#business02Wrap ul.cal > li span.t02 {color: #009a9d;}
	#business02Wrap ul.cal > li span.t03 {color: #1c69c9;}

	#business02Wrap ul.cal > li > ul {display: block; width: 100%; box-sizing: border-box; padding: 20px 0 0 5%;}
	#business02Wrap ul.cal > li > ul > li {line-height: 25px; font-size: 16px; font-weight: 300; color: #222;}
	#business02Wrap ul.cal > li > ul > li.point {display: block; text-align: center; margin-top: 10px; height: 40px; line-height: 40px; font-weight: 500; color: #fff; background: linear-gradient(45deg, #00b7bb 25%, #1c69c9 90%);}

	@media screen and (max-width: 980px) {
		#business02Wrap .math {padding: 20px;}
		#business02Wrap .math > .baseFrmula {height: 40px; line-height: 40px; font-size: 32px;}
		#business02Wrap .math > .baseFrmula sup {font-size: 16px;}
		#business02Wrap ul.cal {margin: 20px auto 0; width: 100%; padding: 29px;}
		#business02Wrap ul.cal > li {font-size: 16px;}
		#business02Wrap ul.cal > li > ul {padding: 10px 0 0 5%;}
		#business02Wrap ul.cal > li > ul > li {line-height: 20px; font-size: 14px;}
		#business02Wrap ul.cal > li > ul > li.point {height: 30px; line-height: 30px;}
	}
	@media screen and (max-width: 720px) {
		#business02Wrap .math {padding: 20px;}
		#business02Wrap .math > .baseFrmula {height: 40px; line-height: 40px; font-size: 26px;}
		#business02Wrap .math > .baseFrmula sup {font-size: 14px;}
		#business02Wrap ul.cal {margin: 10px auto 0; padding: 19px;}
		#business02Wrap ul.cal > li {font-size: 14px;}
		#business02Wrap ul.cal > li > ul {padding: 10px 0 0 2%;}
		#business02Wrap ul.cal > li > ul > li {line-height: 20px; font-size: 13px;}
		#business02Wrap ul.cal > li > ul > li.point {height: 30px; line-height: 30px;}
	}
	@media screen and (max-width: 640px) {
		#business02Wrap .math {padding: 10px;}
		#business02Wrap .math > .baseFrmula {height: 30px; line-height: 30px; font-size: 18px;}
		#business02Wrap .math > .baseFrmula sup {font-size: 11px;}
		#business02Wrap ul.cal {margin: 10px auto 0; padding: 9px;}
		#business02Wrap ul.cal > li {font-size: 13px;}
		#business02Wrap ul.cal > li > ul {padding: 10px 0 0 2%;}
		#business02Wrap ul.cal > li > ul > li {line-height: 20px; font-size: 12px;}
		#business02Wrap ul.cal > li > ul > li.point {height: auto; line-height: 30px;}
	}
	/* for business02 end */


	/* for business03 start */
	#business03Wrap ul.b03 {width: 100%;}
	#business03Wrap ul.b03 > li {list-style: disc outside; box-sizing: border-box; margin-left: 20px; line-height: 25px; font-size: 16px; font-weight: 300; color: #222;}
	#business03Wrap ul.b03 > li > span {font-size: 14px; font-weight: 400; color: #009a9d;}
	
	#business03Wrap ul.b04 {display: table; width: 100%; box-sizing: border-box; padding: 10px; background-color: #f9f9f9;}
	#business03Wrap ul.b04 > li {float: left; display: table-cell; width: 50%; height: 120px; box-sizing: border-box; padding: 10px;}
	#business03Wrap ul.b04 > li > p {display: block; width: 100%; height: 100px; box-sizing: border-box; padding: 29px; border: 1px #eee solid; border-radius: 30px; line-height: 20px; font-size: 18px; font-weight: 400; color: #222; text-align: center; background-color: #fff;}
    @media screen and (max-width: 660px) {
		#business03Wrap ul.b04 {}
		#business03Wrap ul.b04 > li {height: 220px;}
		#business03Wrap ul.b04 > li > p {margin: 0 auto; width: 200px; height: 200px; padding: 79px 0; border-radius: 50%; font-size: 16px;}
    }
    @media screen and (max-width: 660px) {
    }
    @media screen and (max-width: 480px) {
		#business03Wrap ul.b04 {padding: 5px;}
		#business03Wrap ul.b04 > li {height: auto; padding: 5px;}
		#business03Wrap ul.b04 > li > p {margin: 0 auto; width: 100%; height: 140px; padding: 49px 0; border-radius: 30px; font-size: 14px;}
	}
	#business03Wrap p.price {display: block; width: 100%; text-align: center; line-height: 30px; font-size: 28px; font-weight: 500; color: #fff; background: linear-gradient(45deg, #00b7bb 25%, #1c69c9 90%);}
	#business03Wrap p.price > span {font-size: 18px;}
    /*#business03Wrap div.price {padding: 30px;}*/
    #business03Wrap div.price ul {float: left; width: 48.5%; padding: 0 60px 24px; box-sizing: border-box; border: 1px dotted #777; border-radius: 20px; margin: 20px 0 0 0; margin-right: 3%;}
    #business03Wrap div.price ul:nth-child(2) {margin-right: 0;}
    #business03Wrap div.price ul li h6 {padding: 12px 10px; margin-bottom: 15px; border-bottom: 1px dotted #777; font-size: 19px; font-weight: 300; color: #1c69c9;}
    #business03Wrap div.price ul:nth-child(3) {width: 100%; border: none; font-weight: 200; font-size: 16px;}
    
    @media screen and (max-width: 480px) {
		#business03Wrap p.price {font-size: 24px;}
		#business03Wrap p.price > span {font-size: 16px;}
    }

	#business03Wrap ul.article {position: relative; width: 100%; box-sizing: border-box; padding: 20px; background-color: #f9f9f9;}
	#business03Wrap ul.article > li {float: left; width: 33.33%; box-sizing: border-box; padding: 10px;}
	#business03Wrap ul.article > li > h6 {
		background: linear-gradient(45deg, #00b7bb 25%, #1c69c9 90%); /*#8cd400 2%, */
		width: 100%; height: 60px; box-sizing: border-box; padding: 10px; line-height: 40px; font-size: 17px; font-weight: 500; color: #fff; text-shadow: 1px 1px 2px #999; background-color: #00819d;
	}
		
	#business03Wrap ul.article > li > h6 > span {font-size: 28px; font-weight: 200;}
	#business03Wrap ul.article > li > ul {margin-top: 10px; display: block; width: 100%; height: 120px; box-sizing: border-box; padding: 19px; border: 1px #eee solid; background-color: #fff;}
	#business03Wrap ul.article > li > ul > li {list-style: disc inside; width: 100%; height: 25px; line-height: 25px; font-size: 15px; font-weight: 400; color: #222;}

	@media screen and (max-width: 1220px) {
		#business03Wrap ul.article > li > h6 {font-size: 15px;}
		#business03Wrap ul.article > li > h6 > span {font-size: 24px;}
		#business03Wrap ul.article > li > ul > li {height: 20px; line-height: 20px; font-size: 13px;}
	}
	@media screen and (max-width: 820px) {
		#business03Wrap ul.article {padding: 0px;}
		#business03Wrap ul.article > li {width: 50%;}
		#business03Wrap ul.article > li > h6 {height: 40px; line-height: 20px; font-size: 14px;}
		#business03Wrap ul.article > li > h6 > span {font-size: 18px;}
	}
    @media screen and (max-width: 660px) {
        #business03Wrap div.price ul {padding: 0 22px 24px;}
    }
    
	@media screen and (max-width: 480px) {
		#business03Wrap ul.article {padding: 20px;}
		#business03Wrap ul.article > li {width: 100%;}
	}
	/* for business03end */















