@charset "utf-8";

body.main h3 {font-size:30px; line-height: 30px; color:#2c2c2c;}
body.main #content {margin-bottom: 0;}

#m_sec1 {position: relative; width: 100%; height:600px;}
#m_sec1 div.mainvisual {display: block; position: relative; height:600px;}
#m_sec1 div.mainvisual div.img {display: block; height: 600px; }

#m_sec1 div.txt {padding:100px 90px 0 90px; box-sizing: border-box;}
#m_sec1 div.txt p.index {display:inline-block; padding:0 20px;  font-size:16px; text-align:center;border-radius:40px; line-height: 40px;color:#fff;}
#m_sec1 div.txt p.title {margin:40px 0 30px 0;font-size:52px;line-height:60px; font-weight: bold; color:#222}
#m_sec1 div.txt p.sub_title {font-size:18px; line-height: 24px;}

#m_sec1 div.mainvisual div.bg1 {background: url("../../img/main/img_mainvisual1.png") 50% 0 no-repeat #def1ff; }
#m_sec1 div.mainvisual div.bg1 div.txt p.index  {background-color:#0066ad;}
#m_sec1 div.mainvisual div.bg2 {background: url("../../img/main/img_mainvisual2.png") 50% 0 no-repeat #e5f6f7; }
#m_sec1 div.mainvisual div.bg2 div.txt p.index  {background-color:#00858e;}

#m_sec1 .bx-pager {position: absolute; left:50%; bottom:20px; height:36px; padding: 0 20px; border-radius:36px; z-index: 50; background-color: #c7d3da;}
#m_sec1 .bx-pager .bx-pager-item {display: inline-block;margin: 12px 4px; }
#m_sec1 .bx-pager .bx-pager-item .bx-pager-link { display: block; width:12px; height:12px; border-radius: 12px;  font-size:0; background-color:#8b9398;}
#m_sec1 .bx-pager .bx-pager-item .bx-pager-link.active {background-color:#fff;}

#m_sec1 .bx-controls-direction {}
#m_sec1 .bx-controls-direction a {position:absolute; overflow: hidden; top:260px;   z-index: 50;display:inline-block; width:70px; height:70px; border-radius:70px; line-height: 70px; text-align: center; background-color:rgba(0,0,0,0.3); font-size: 0; color:#fff;  }
#m_sec1 .bx-controls-direction a::before {display: inline-block; font-family:"FontAwesome"; font-size:36px;}
#m_sec1 .bx-controls-direction a.bx-prev {left:50%; margin-left:-580px;}
#m_sec1 .bx-controls-direction a.bx-prev::before {content:"\f104"}
#m_sec1 .bx-controls-direction a.bx-next {right:50%; margin-right:-580px;}
#m_sec1 .bx-controls-direction a.bx-next::before { content:"\f105"}

/* m_sec2 */
#m_sec2 {position:relative; height:400px; padding-top:80px; box-sizing:border-box;}
#m_sec2:after {display:block; clear:both; content:"";}
#m_sec2 div.left {float: left; width:314px;}
#m_sec2 div.right {float: right; width:886px;}
#m_sec2 h3 {}
#m_sec2 p {margin-top:30px; color:#555555;}
#m_sec2 div.item_catagory {position: relative; width:886px;}
#m_sec2 div.item_catagory div.catagory{float: left; width:886px;}
#m_sec2 div.item_catagory div.catagory a {display: inline-block; text-align: center; outline: none;}
#m_sec2 div.item_catagory div.catagory a strong {font-size:16px; line-height: 48px;}

#m_sec2 div.item_catagory div.catagory a:focus,
#m_sec2 div.item_catagory div.catagory a:active,
#m_sec2 div.item_catagory div.catagory a:hover {text-decoration: none; color:#d52e2e;}

#m_sec2 button.slick-arrow {position: absolute; z-index: 10;}
#m_sec2 button.slick-prev,
#m_sec2 button.slick-next { display:block; width:40px; height:40px; border-radius:40px; border:1px solid #ddd; top:80px; font-size:0; line-height: 35px; background:rgba(255,255,255,0.5); color:#333; outline: none;}
#m_sec2 button.slick-prev {left:-10px;}
#m_sec2 button.slick-next {right:-10px;}

#m_sec2 button.slick-prev:before,
#m_sec2 button.slick-next:before {font-family: "FontAwesome"; font-size:24px; color:#333; }
#m_sec2 button.slick-prev:before {content: "\f104";}
#m_sec2 button.slick-next:before {content: "\f105";}

#m_sec2 button.slick-prev:hover,
#m_sec2 button.slick-next:hover  {border-color:#333; background-color:#333;}
#m_sec2 button.slick-prev:hover:before,
#m_sec2 button.slick-next:hover:before {  color:#fff;}

/* m_sec3 */
#m_sec3 {position:relative;border-top:1px solid #e9e9e9; box-sizing:border-box;}
#m_sec3:after {display:block; clear:both; content:"";}
#m_sec3 div.left,
#m_sec3 div.right { height:530px; box-sizing: border-box; border-right:1px solid #e9e9e9;}
#m_sec3 div.left {float: left; width:400px;  padding:60px 30px 0 30px;border-left:1px solid #e9e9e9;}
#m_sec3 div.right {float: right; width:800px; padding:60px 45px 0 45px;}

#m_sec3 div.left h3 {text-align: center; margin-bottom:40px;}
#m_sec3 div.left h3 strong {color:#d52e2e;}

#m_sec3 div.right h3,
#m_sec3 div.right p {display:inline-block;}
#m_sec3 div.right h3 {margin:0 10px 75px 0; }

/* m_sec3 > product */
#m_sec3 .sct.pro_list .sct_basic {display:none;}
#m_sec3 .sct.pro_list .no_data {padding:100px 0; text-align: center;}

#m_sec3 .left .pro_list { width:220px; margin:0 auto;}
#m_sec3 .left .pro_list .sct_img {overflow: hidden; width:220px;}
#m_sec3 .left .sct .sct_img {margin-bottom:20px;}
#m_sec3 .left .sct .sct_txt {margin-bottom:20px; font-size:20px; }
#m_sec3 .left .sct .sct_cost .sct_discount {font-size:14px;}
#m_sec3 .left .sct .sct_cost {font-size:20px}
#m_sec3 .left .pro_list { width:220px; margin:0 auto;}

#m_sec3 .right .pro_list {overflow: hidden; }
#m_sec3 .right .pro_list:after {display: block; clear:both; content:"";}
#m_sec3 .right .pro_list .sct_li  {width:170px; float: left; margin-left: 9px;}
#m_sec3 .right .pro_list .sct_li:first-child  {margin-left:0;}
#m_sec3 .right .pro_list .sct_img {overflow: hidden; width:170px; height:170px;}
#m_sec3 .right .sct .sct_img {margin-bottom:20px;}
#m_sec3 .right .sct .sct_txt {margin-bottom:20px; font-size:16px}
#m_sec3 .right .sct .sct_cost .sct_discount {font-size:12px;}
#m_sec3 .right .sct  sct_cost {font-size:16px}

#m_sec3 button.slick-arrow {position: absolute; z-index: 10;}
#m_sec3 button.slick-prev,
#m_sec3 button.slick-next { display:block; width:40px; height:40px; border-radius:40px; border:1px solid #ddd; top:80px; font-size:0; line-height: 35px; background:rgba(255,255,255,0.5); color:#333;}
#m_sec3 button.slick-prev {left:-60px;}
#m_sec3 button.slick-next {right:-60px;}

#m_sec3 button.slick-prev:before,
#m_sec3 button.slick-next:before {font-family: "FontAwesome"; font-size:24px; color:#333; }
#m_sec3 button.slick-prev:before {content: "\f104";}
#m_sec3 button.slick-next:before {content: "\f105";}

#m_sec3 button.slick-prev:hover,
#m_sec3 button.slick-next:hover  {border-color:#333; background-color:#333;}
#m_sec3 button.slick-prev:hover:before,
#m_sec3 button.slick-next:hover:before {  color:#fff;}


/* m_sec4 */
#m_sec4 {position:relative; height: 170px;margin-top:-24px; background:url("../../img/main/bg_banner_color.png") 0 0 repeat-x;}

#m_sec4 .inner { background:url("../../img/main/bg_banner.png") right 0 no-repeat;}
#m_sec4 .inner a {display:inline-block; padding-top:40px; width:100%; height: 150px;  color:#fff; box-sizing:border-box;}
#m_sec4 .inner a:hover, 
#m_sec4 .inner a:focus, 
#m_sec4 .inner a:active {text-decoration:none;}
#m_sec4 h3 {font-size:18px; margin-bottom:10px; color:#fff; opacity: 0.8; }
#m_sec4 p {font-size:30px; }
#m_sec4 i {width:25px; height:25px; font-size:12px; line-height: 25px; text-align: center; vertical-align:middle; border-radius:25px; border:1px solid #fff; }
