@import url("https://fonts.googleapis.com/css?family=Rajdhani:400,600,700");
@import url("https://fonts.googleapis.com/css?family=Roboto:400,500,700");
body{color:#000;font-family:"Roboto",sans-serif;font-size:15px;font-weight:400;line-height:1.667}
ul{list-style-type:none;margin:0;padding:0}
a:hover{text-decoration:none}
button{cursor:pointer}
button:focus{outline:0;box-shadow:none}
h2,.h2{font-size:28px;font-weight:700}
@media (min-width: 1000px){
h2,.h2{font-size:36px}
}
h3,.h3{font-size:20px;font-weight:600}
@media (min-width: 1000px){
h3,.h3{font-size:22px}
}
.pb-85px{padding-bottom:45px}
@media (min-width: 1000px){
.pb-85px{padding-bottom:85px}
}
.section-margin{margin:30px 0}
@media (min-width: 1000px){
.section-margin{margin:40px 0}
}
@media (min-width: 1200px){
.section-margin{margin:50px 0}
}
.section-margin--medium{margin:40px 0}
@media (min-width: 800px){
.section-margin--medium{margin:80px 0}
}
@media (min-width: 1200px){
.section-margin--medium{margin:120px 0}
}
.section-padding{padding:60px 0}
@media (min-width: 1000px){
.section-padding{padding:100px 0}
}
@media (min-width: 1200px){
.section-padding{padding:135px 0}
}
.section-padding--small{padding:60px 0}
@media (min-width: 1000px){
.section-padding--small{padding:100px 0}
}
.bg-magnolia{background:#faf9ff}
.header_area{background:#fff;position:absolute;top:0;width:100%;z-index:99;transition:background 0.4s, all 0.3s linear}
.header_area .navbar-right{min-width:200px;text-align:right}
@media (max-width: 991px){
.header_area .navbar-right{margin:20px 0}
}
.header_area .navbar-brand{margin-right:30px}
.header_area .navbar-social{min-width:95px;float:right}
.header_area .navbar-social li{margin-right:12px}
.header_area .navbar-social li i,.header_area .navbar-social li span{font-size:13px;color:#242429}
.header_area .navbar-social li:last-child{margin-right:0}
.header_area .navbar-social li a:hover i,.header_area .navbar-social li span{color:#21146a}
.header_area .menu_nav{width:100%}
.header_area .navbar{background:transparent;padding:5px 0;border:0px;border-radius:0px;width:100%}
/*@media (min-width: 991px){
.header_area .navbar{padding:20px 0}
}*/
.header_area .navbar .nav .nav-item{margin-right:30px}
/*.header_area .navbar .nav .nav-item .nav-link{font-family:"Roboto",sans-serif;color:#fff;font-size:14px;text-transform:capitalize;font-weight:700;display:inline-block}*/
.header_area .navbar .nav .nav-item .nav-link{font-family:"Roboto",sans-serif;color:#000;font-size:14px;text-transform:capitalize;font-weight:700;display:inline-block}
.header_area .navbar .nav .nav-item .nav-link:after{display:none}
.header_area .navbar .nav .nav-item:hover .nav-link,.header_area .navbar .nav .nav-item.active .nav-link{color:#fff;opacity:.75}
.header_area .navbar .nav .nav-item.submenu{position:relative}
.header_area .navbar .nav .nav-item.submenu ul{border:none;padding:0px;border-radius:0px;box-shadow:none;margin:0px;background:#fff}
@media (min-width: 992px){
.header_area .navbar .nav .nav-item.submenu ul{position:absolute;top:120%;left:0px;min-width:200px;text-align:left;opacity:0;transition:all 300ms ease-in;visibility:hidden;display:block;border:none;padding:0px;border-radius:0px;box-shadow:0px 10px 30px 0px rgba(0,0,0,0.4)}
}
.header_area .navbar .nav .nav-item.submenu ul:before{content:"";width:0;height:0;border-style:solid;border-width:10px 10px 0 10px;border-color:#eeeeee transparent transparent transparent;position:absolute;right:24px;top:45px;z-index:3;opacity:0;transition:all 400ms linear}
.header_area .navbar .nav .nav-item.submenu ul .nav-item{display:block;float:none;margin-right:0px;border-bottom:1px solid #ededed;margin-left:0px;transition:all 0.4s linear}
.header_area .navbar .nav .nav-item.submenu ul .nav-item .nav-link{line-height:45px;color:#21146a !important;padding:0px 30px;transition:all 150ms linear;display:block;margin-right:0px}
.header_area .navbar .nav .nav-item.submenu ul .nav-item:last-child{border-bottom:none}
.header_area .navbar .nav .nav-item.submenu ul .nav-item:hover .nav-link{background-color:#21146a;color:#fff !important}
@media (min-width: 992px){
.header_area .navbar .nav .nav-item.submenu:hover ul{visibility:visible;opacity:1;top:100%}
}
.header_area .navbar .nav .nav-item.submenu:hover ul .nav-item{margin-top:0px}
.header_area .navbar .nav .nav-item:last-child{margin-right:0px}
.header_area .navbar .search{font-size:12px;line-height:60px;display:inline-block;margin-left:80px}
.header_area .navbar .search i{font-weight:600}
/*.header_area.navbar_fixed .main_menu{position:fixed;width:100%;top:-70px;left:0;right:0;background:#412fb3;z-index:99;transform:translateY(70px);transition:transform 500ms ease, background 500ms ease;-webkit-transition:transform 500ms ease, background 500ms ease;box-shadow:0px 3px 16px 0px rgba(0,0,0,0.1)}*/
.header_area.navbar_fixed .main_menu{position:fixed;width:100%;top:-70px;left:0;right:0;background:#fff;z-index:99;transform:translateY(70px);transition:transform 500ms ease, background 500ms ease;-webkit-transition:transform 500ms ease, background 500ms ease;box-shadow:0px 3px 16px 0px rgba(0,0,0,0.1)}
.header_area.navbar_fixed .main_menu .navbar .nav .nav-item .nav-link{line-height:20px}
@media (max-width: 767px){.home_banner_area{min-height:500px}
.home_banner_area .banner_inner{min-height:500px}
.home_banner_area .banner_inner .banner_content{margin-top:0px}
.blog_banner .banner_inner .blog_b_text h2{font-size:40px;line-height:50px}
.blog_info.text-right{text-align:left !important;margin-bottom:10px}
.home_banner_area .banner_inner .banner_content h3{font-size:30px}
.home_banner_area .banner_inner .banner_content p br{display:none}
.home_banner_area .banner_inner .banner_content h3 span{line-height:45px;padding-bottom:0px;padding-top:0px}
.footer-bottom{text-align:center}
.footer-bottom .footer-social{text-align:center;margin-top:15px}
.made_life_inner .nav.nav-tabs li{flex:0 0 50%;max-width:50%;margin-bottom:15px}
.made_life_inner .nav.nav-tabs{margin-bottom:-15px}
.made_life_area.made_white .left_side_text{margin-bottom:0px;margin-top:30px}
}
@media (max-width: 575px){
.top_menu{display:none}
.header_area+section,.header_area+row,.header_area+div{margin-top:51px}
.home_banner_area .banner_inner .banner_content h2{font-size:28px;line-height:38px}
.home_banner_area{min-height:450px}
.home_banner_area .banner_inner{min-height:450px}
.blog_banner .banner_inner .blog_b_text{margin-top:0px}
.home_banner_area .banner_inner .banner_content img{display:none}
.home_banner_area .banner_inner .banner_content h5{margin-top:0px}
.p_120{padding-top:70px;padding-bottom:70px}
.main_title h2{font-size:25px}
.sample-text-area{padding:70px 0 70px 0}
.generic-blockquote{padding:30px 15px 30px 30px}
.blog_details h2{font-size:20px;line-height:30px}
.blog_banner .banner_inner .blog_b_text h2{font-size:28px;line-height:38px}
.footer-area{padding:70px 0px}
.pad_top{padding-top:70px}
.pad_btm{padding-bottom:70px}
}
@media (max-width: 480px){
.header_area .navbar-collapse{max-height:250px}
.home_banner_area .banner_inner .banner_content{padding:30px 15px;margin-top:0px}
.banner_content .white_btn{display:block}
.home_banner_area .banner_inner .banner_content h3{font-size:24px}
.banner_area .banner_inner .banner_content h2{font-size:32px}
.comments-area .thumb{margin-right:10px}
.testi_item .media .d-flex{padding-right:0px}
.testi_item .media .d-flex img{width:auto;margin-bottom:15px}
.testi_item .media{display:block}.banner_btn{margin-bottom:20px}
.hero-banner{padding:90px 0 0 0;z-index:1}
}
.hero-banner{position:relative; background:#fff; background-size:cover; padding:90px 0 60px 0;z-index:1}
@media (min-width: 600px){.hero-banner{padding:150px 0 120px 0}
}
@media (min-width: 991px){.hero-banner{padding:175px 0 100px 0}
}
@media (min-width: 1200px){.hero-banner{padding:265px 0 100px 0}
}
.hero-banner__content h1{color:#fff;;margin-top: -100px;}
.hero-banner__content h1 img{width: 240px;margin-bottom: 13px}
@media screen and (max-width: 767px){
.hero-banner__content h1{margin-top: 0px;}
.hero-banner__content{margin-bottom: 20px}
.hero-banner__content h1 img{width: 160px}
}
@media screen and (max-width: 480px){
.hero-banner__content h1{margin-top: 0px;}
.hero-banner__content{margin-bottom: 20px}
.hero-banner__content h1 img{width: 140px}
}
.hero-banner__content p{color:#000;margin-bottom:45px}
.hero-banner::after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:1000px;background:url(../img/banner/cd2h_bg.png) left center no-repeat;background-size:cover;z-index:-1;background-color: #000;}
.hero-banner--sm{padding:0;height:300px}
.hero-banner--sm::after{height:100%}
@media (min-width: 1000px){
.hero-banner--sm{height:500px}
}
.hero-banner--sm__content{position:absolute;top:50%;left:50%;width:100%;transform:translate(-50%, -50%);margin-top:20px;text-align:center}
@media (min-width: 600px){
.hero-banner--sm__content{margin-top:40px}
}
.hero-banner--sm__content>*{color:#fff}.hero-banner--sm__content h3{font-size:27px;margin-bottom:0}
.hero-banner--sm__content h1{margin-bottom:10px}
.hero-banner--sm__content h4{font-size:18px}
@media (min-width: 991px){
.offer-single__img{position:absolute;width:100%;top:50%;transform:translateY(-50%)}
}
@media (min-width: 991px) and (min-width: 1200px){
.offer-single__img{transform:translateY(0);top:50px;left:100px}
}
@media (min-width: 991px){
.offer-single-wrapper .offer-single:nth-child(even){position:relative;top:40px}
}
@media (min-width: 1200px){
.solution__img{position:relative;left:-60px}
}
@media (min-width: 1200px){
.solution__content{padding-left:30px;padding-right:45px}
}
.solution__content h2{margin-bottom:20px}
.solution__content p{margin-bottom:30px}
.button{display:inline-block;border:1px solid transparent;text-transform:capitalize;font-size:15px;font-weight:500;padding:10px 24px;border-radius:8px;background-color:#E8002F;color:#21146a;color:#fff;transition:all .4s ease}
.button i,.button span{margin-left:5px}
@media (min-width: 900px){
.button{padding:12px 45px}
}
.button:hover{background-color:transparent;border-color:#21146a;color:#000022}
.button-header{padding:12px 40px}
.button.bg:hover{border-color:#000;background:#000;color:#fff}
.button-light{background-color:transparent;border-color:#21146a}
.button-light:hover{background-color:#21146a;color:#fff}
.button-blog{border:1px solid #21146a;border-radius:4px;font-size:12px;text-transform:uppercase;letter-spacing:1px;font-weight:500;color:#222222;padding:7px 30px}
.button-blog:hover{background-color:#21146a;color:#fff}
.button-postComment{font-size:12px;text-transform:uppercase;letter-spacing:1px;background-color:#21146a;color:#fff;border-radius:4px;padding:14px 45px}
.button-contactForm{font-size:15px;background-color:#21146a;color:#fff;padding:12px 36px}
.button-contactForm:hover{border-color:#21146a;color:#21146a}
.footer-area{padding:60px 0px 30px;background:#dddddd}
@media (max-width: 991px){
.footer-area{padding:60px 0px}
}
@media (max-width: 991px){
.footer-area .single-footer-widget{margin-bottom:30px}
}
.footer-area .single-footer-widget p{color:#7b838a}
.footer-area .single-footer-widget h4{color:#000;font-size:16px;margin-bottom:10px;font-weight:600}
.footer-area .single-footer-widget h4 a{color:#000;font-size:16px}
@media (max-width: 1024px){
.footer-area .single-footer-widget h4{font-size:16px}
}
@media (max-width: 991px){
.footer-area .single-footer-widget h4{margin-bottom:15px}
}
.footer-area .single-footer-widget ul li{margin-bottom:10px}
.footer-area .single-footer-widget ul li a{color:#000}
.footer-area .single-footer-widget .form-wrap{margin-top:25px}
.footer-area .single-footer-widget input{height:48px;border:none;width:67% !important;font-weight:400;background:rgba(255,255,255,0.2);color:#fff;padding-left:20px;border-radius:0;font-size:14px;padding:10px}
.footer-area .single-footer-widget input:focus{outline:none;box-shadow:none}
.footer-area .single-footer-widget input.placeholder{padding-left:10px;color:#797979}
.footer-area .single-footer-widget input:-moz-placeholder{padding-left:10px;color:#797979}
.footer-area .single-footer-widget input::-moz-placeholder{padding-left:10px;color:#797979}
.footer-area .single-footer-widget input::-webkit-input-placeholder{padding-left:10px;color:#797979}
.footer-area .single-footer-widget .click-btn{font-family:"Roboto",sans-serif;color:#3a414e;border-radius:0;border-top-left-radius:0px;border-bottom-left-radius:0px;padding:8px 20px;border:0;font-size:14px;background:#fff;font-weight:500;text-transform:capitalize;position:relative;left:0}
.footer-area .single-footer-widget .click-btn:focus{outline:none;box-shadow:none}
@media (max-width: 375px){
.footer-area .single-footer-widget .click-btn{margin-top:10px}
}
@media (min-width: 400px){
.footer-area .single-footer-widget .click-btn{left:-50px}
}
.footer-area .footer-bottom{margin-top:70px}
@media (max-width: 991px){
.footer-area .footer-bottom{margin-top:20px}
}
.footer-area .footer-bottom p{color:#000}
.footer-area .footer-bottom p a{color:#000}
.footer-area .footer-bottom .footer-social{text-align:center}
@media (max-width: 991px){
.footer-area .footer-bottom .footer-social{text-align:left;margin-top:30px}
}
.footer-area .footer-bottom .footer-social a{background:#7e7e7e;margin-left:3px;width:32px;color:#fff;display:inline-grid;text-align:center;height:32px;align-content:center}
.footer-area .footer-bottom .footer-social a:hover{background:#fff;color:#21146a}
.footer-area .footer-bottom .footer-social a i,.footer-area .footer-bottom .footer-social a span{font-size:14px}

.logo_h img{width: 30%}
dl.tel_h{margin-top: -3%; float: right; width: 300px; position: relative}
dl.tel_h dt{ margin: 0px; font-style: normal; font-weight: normal; right: 0%; top: 15px; position: absolute;font-size: 150%}
dl.tel_h dt span{ font-size: 70%}
dl.tel_h dd{margin: 0px; right: 3%; top: 0%; font-size: 80%; position: absolute}
.r_balloon{right: 0%; top: 15%; position: absolute}
@media (max-width: 600px){
.r_balloon{width: 80%;}
}
@media (max-width: 480px){
.r_balloon{width: 80%;}
}
@media (max-width: 480px){
.l_balloon ul li.type{font-size:15px}
.l_balloon ul li.name{font-size:24px}
.l_balloon ul li.ico img{width: 120px;float: left;margin-top:-50px}
}
.hero-banner .s_g_nav{position: absolute;bottom:0;width: 1000px}
.footer_op{ padding-bottom: 10px; margin-bottom: 20px; border-bottom-color: #bfbfbf; border-bottom-width: 1px; border-bottom-style: solid;width: 1100px}
.footer_op a{color: black}
.main_area,.info_area{margin-top:-20px}
.prd_area{margin-top:-50px;margin-bottom:50px;}
.main_area img,.info_area img,.prd_area img{width: 100%}
.main_area dl.io_main{position: relative; clear: both;margin-top: 100px}
.main_area dl.io_main dt.io_main_ttl{top: 10%; left: 52%; line-height: 1.3em; font-size: 28px; position: absolute; width: 45%;}
.main_area dl.io_main dt.io_main_txt{ top: 45%; left: 8%; position: absolute; font-size: 18px; line-height: 1.4em; width: 45%;}
.main_area dl.io_main dt.io_main_balloon{ top: 70%; left: 8%; width: 50%; position: absolute;}
.main_area dl.io_main dt.io_main_notice{top: 45%; left: 52%; font-size: 12px; position: absolute;}
.main_area dl.io_main dt.io_main_name{ left: 700px; color: white; position: absolute; bottom: 200px; width: 20%}
.main_area dl.io_main dt.io_main_name ul li.type{margin-bottom: -7px; font-size: 16px;}
.main_area dl.io_main dt.io_main_name ul li.name{margin-bottom: -7px; font-size: 28px;}
.main_area dl.io_main dt.io_main_name ul li.price{font-size: 18px;}
.main_area dl.io_main dt.io_main_ico{ left: 700px; position: absolute; bottom: 50px; width: 20%}
.main_area ul li.information_ttl{ font-size: 26px; font-weight: bold; margin-bottom: 10px; }
.info_ttl{margin-left: 15px; font-size: 26px; font-weight: bold; margin-bottom: 10px; float: left;display: flex; margin-top: 20px;}
.main_area ul li.information_txt{ font-size: 16px; margin-bottom: 10px; clear: both;}
.main_area ul li.information_notice{ font-size: 12px; margin-bottom: 10px;}
.prd_area .prd_ttl{margin-bottom: 20px; font-size: 40px;}
.prd_area .prd_ttl img{margin-bottom: 8px; width: 18%;}
.prd_area .prd_l_ttl{ padding-bottom: 7px; padding-top: 7px; padding-left: 20px; border-left-color: #E8002F; border-left-style: solid; border-left-width: 10px; color: white; background-color: black; font-size: 28px;}
.prd_area .prd_area_l{width: 75%;float: left; padding-top: 20px; float: left;}
.prd_area .prd_area_r{width: 25%;float: right; padding-top: 20px; float: left;}
.prd_area .prd_area_l p,.prd_area .prd_area_r p{font-size: 20px}
.prd_area .prd_area_l img,.prd_area .prd_area_r img{width: 100%; vertical-align: top !important;}
.hero-banner__content .io_top_txt{width: 500px;font-size: 18px;font-weight: 700}
.main_area ul li.information_ttl span {margin-right: 15px;float: left;padding: 5px;width: 120px;text-align: center;font-size: 16px;font-weight: bold;background-color: yellow;border-radius: 5px;line-height: 1.3em;float: left;margin-bottom:15px;}
.info_ttl span {margin-left: 15px;margin-right: 15px;float: left;padding: 5px;width: 200px;text-align: center;font-size: 16px;font-weight: bold;background-color: yellow;border-radius: 5px;line-height: 1.3em;margin-top:10px;height: 30px}

@media screen and (max-width: 1000px){
.hero-banner::after{height: 1300px; background: url(../img/banner/cd2h_bg_sp.png) left center no-repeat;background-size: auto;background-color: #000;}
.main_area dl.io_main{margin-top: 100px}
.main_area dl.io_main dt.io_main_ttl{margin-top: 10px;width: 100%; color: black; position:static;font-size: 24px}
.main_area dl.io_main dt.io_main_txt{margin-top: 10px;width: 100%; color: black; position:static;font-size: 16px}
.main_area dl.io_main dt.io_main_balloon{margin-top: 10px;width: 100%; color: black; position:static}
.main_area dl.io_main dt.io_main_notice{margin-top: 10px;width: 100%; color: black; position:static;font-size: 12px}
}

@media screen and (max-width: 767px){
.hero-banner::after{height: 1300px; background: url(../img/banner/cd2h_bg_sp.png) left center no-repeat;background-size: auto;background-color: #000;}
.footer-area .single-footer-widget ul li{ margin-bottom:-50px}
.footer-area .single-footer-widget ul li.mg_t{ margin-bottom:-15px}
.footer-area .single-footer-widget ul li.mg_o{ margin-bottom:-13px}
.footer-area .footer-bottom p{ margin-top:30px;margin-left:15px}
.footer_op{ width: 100%}
.main_area,.info_area{margin-top:-50px}
.logo_h{ width: 100px}
.logo_h img{width: 90%; margin-left:10px}
dl.tel_h{ width: 300px; float: right}
dl.tel_h dt{top: 12px; position: absolute;font-size: 120%}
dl.tel_h dd{right: 1.5%;font-size: 80%}
.l_balloon p{margin-top:25px;font-size: 90%;}
.main_area dl.io_main{height: auto;width: 100%; position:static}
.main_area dl.io_main dt.io_main_ttl{margin-top: 10px;width: 100%; color: black; position:static;font-size: 24px}
.main_area dl.io_main dt.io_main_txt{margin-top: 10px;width: 100%; color: black; position:static;font-size: 16px}
.main_area dl.io_main dt.io_main_balloon{margin-top: 10px;width: 100%; color: black; position:static}
.main_area dl.io_main dt.io_main_notice{margin-top: 10px;width: 100%; color: black; position:static;font-size: 12px}
.main_area dl.io_main dt.io_main_name{margin-top: 20px;width: 100%;color: black; position:static}
.io_main .d-block{margin-top:40px;}
.main_area ul li.information_ttl span {font-size: 14px;}
.info_ttl span {font-size: 14px;}
}

@media screen and (max-width: 480px){
.hero-banner::after{height: 900px; background: url(../img/banner/cd2h_bg_sp.png) left center no-repeat;background-size: auto;background-color: #000;}
.footer-area .single-footer-widget ul li{ margin-bottom:-50px}
.footer-area .single-footer-widget ul li.mg_t{ margin-bottom:-15px}
.footer-area .single-footer-widget ul li.mg_o{ margin-bottom:-13px}
.footer-area .footer-bottom p{ margin-top:30px;margin-left:15px}
.footer_op{ width: 100%}
.main_area,.info_area{margin-top:-50px}
.logo_h{ width: 100px}
.logo_h img{width: 80%; margin-left:10px}
dl.tel_h{ width: 200px; float: right}
dl.tel_h dt{top: 12px; position: absolute;font-size: 110%}
dl.tel_h dd{right: 1.5%;font-size: 70%}
.main_area .DesktopHidden { display:none;}
.main_area .MobileHidden { display:inline;}
.main_area ul li.information_ttl span {margin-right: 15px;float: left;padding: 5px;width: 150px;text-align: center;font-size: 14px;font-weight: bold;background-color: yellow;border-radius: 5px;line-height: 1.3em;float: left;margin-bottom:15px;}
.info_ttl {width: 100%}
.info_ttl span {margin-left: 5px;margin-right: 5px;font-size: 12px; width: 140px}
.main_area dl.io_main{height: auto;width: 100%; position:static}
.main_area dl.io_main img.MobileHidden{width: 100%}
.main_area dl.io_main dt.io_main_ttl{margin-top: 10px;width: 100%; color: black; position:static;font-size: 24px}
.main_area dl.io_main dt.io_main_txt{margin-top: 10px;width: 100%; color: black; position:static;font-size: 14px}
.main_area dl.io_main dt.io_main_balloon{margin-top: 10px;width: 100%; color: black; position:static}
.main_area dl.io_main dt.io_main_notice{margin-top: 10px;width: 100%; color: black; position:static;font-size: 12px}
.main_area dl.io_main dt.io_main_name{margin-top: 20px;width: 100%;color: black; position:static}
.main_area dl.io_main dt.io_main_name ul li.type{margin-bottom: -7px; font-size: 16px;}
.main_area dl.io_main dt.io_main_name ul li.name{margin-bottom: -7px; font-size: 28px;}
.main_area dl.io_main dt.io_main_name ul li.price{font-size: 18px;}
.main_area dl.io_main dt.io_main_ico{ width: 50%; position:static}
.main_area ul li.information_ttl{ font-size: 20px;}
.info_ttl{ font-size: 20px;}
.main_area ul li.information_txt{ font-size: 14px;}
.main_area ul li.information_notice{ font-size: 11px;}
.io_main .d-block{margin-top:40px;}
.prd_area .prd_ttl{font-size: 24px;}
.prd_area .prd_ttl img{width: 26%;}
.prd_area .prd_l_ttl{width: 100%; padding-bottom: 4px; padding-top: 4px;border-left-width: 8px;font-size: 20px;}

.prd_area .prd_area_l{width: 100%;}
.prd_area .prd_area_r{width: 60%;}
.prd_area .prd_area_l ul li.area_b p,.prd_area .prd_area_r p{font-size: 14px;}
.prd_area .prd_area_l ul li.area_l p{font-size: 20px;}
.prd_area .prd_area_l ul li.area_l p span{font-size: 14px;}
.hero-banner__content .io_top_txt{width: 100%;font-size: 14px}

}
/* ボタン */
/* balloon */
.balloon_box{padding-bottom: 30px; width: 100%; text-align: center;}
.balloon {position: relative; display: inline-block; margin: 1.5em 0; padding: 7px 10px; min-width: 120px; max-width: 100%; font-size: 20px; background: #e0edff; border-radius: 5px; }
.balloon:before { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -15px; border: 15px solid transparent; border-top: 15px solid #e0edff; }
.balloon p { margin: 0; padding: 0; }
.balloon {font-size: 14px; }
.l_balloon p{margin-top:28px;font-size: 90%;}
.btn_l a {position: relative;display: inline-block;padding: 15px 40px 15px 40px;color: #fff !important;text-align: center;text-decoration: none;-moz-transition: 0.5s;-webkit-transition: 0.5s;-o-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5s;z-index: 1;background: #e60012;border-radius: 5px;margin-right: 10px;font-size: 30px; width: 700px;}
.btn_l a:hover {color: #fff;background: #333;}
@media screen and (max-width: 600px){
.balloon_box{padding-bottom: 5px;}
.btn a,.btn_l a{ font-size: 16px; width: 100%; margin-top:10px; margin-bottom:10px; margin-top:0 auto; float: none;}
}
ul li.f-logo img{width: 200px; top: 15%; position: absolute}
.hero-banner .hero-ml{margin-left:200px;margin-top:0px}

h1,h2,h3,h4,h5,h6{color:#3a414e;line-height:1.25}
h1,.h1{font-size:66px;font-weight:700;line-height:1.15}
h1 span,.h1 span{font-size:70%; background-color: yellow;border-radius: 5px;padding: 5px;color:#000;line-height: 2;}
.l_balloon{color:#fff}
.l_balloon ul li.type{font-size:32px;margin-bottom: -5px;margin-top:15px}
.l_balloon ul li.name{font-size:44px;font-weight: 500; margin-bottom: 10px}
.l_balloon ul li.lineup{font-size:14px;line-height: 1.3em}
.l_balloon ul li.ico{margin-top:30px}
.l_balloon ul li.ico img{width: 150px;}



.r_banner{width: 100%;}
.hero-banner__img{position:relative}
@media (min-width: 1200px){
.l_balloon ul li.spac_pc img{width: 1100px; z-index: 10; margin-top: 50px; position: relative; display: inline}
.l_balloon ul li.spac_sp img{display: none}
.hero-banner__img img{position:absolute;top:-100px;right:0px;width: 641px;max-width: 120%;margin-right: -15px;}
}

@media screen and (max-width: 1200px){
.l_balloon ul li.spac_pc img{display: none}
.l_balloon ul li.spac_sp img{width: 100%; z-index: 10; margin-top: 30px; position: relative; display: inline}
.main_area dl.io_main{margin-top: 0px}
ul li.f-logo img{width: 150px; top: 10%}
.hero-banner .hero-ml{margin-left:50px;margin-top:50px}
.hero-banner__content{margin-top:100px;}
h1,.h1{font-size:60px}
.l_balloon ul li.type{font-size:18px;margin-top:15px}
.l_balloon ul li.name{font-size:28px}
.l_balloon ul li.ico img{width: 120px}
.hero-banner__img img{max-width: 100%}
}

@media screen and (max-width: 767px){
.l_balloon ul li.spac_pc img{display: none}
.l_balloon ul li.spac_sp img{width: 100%; z-index: 10; margin-top: 30px; position: relative; display: inline}
.main_area dl.io_main{margin-top: 0px}
ul li.f-logo img{width: 150px; top: 10%}
.hero-banner .hero-ml{margin-left:50px;margin-top:20px}
.hero-banner__content{margin-top:40px;}
h1,.h1{font-size:50px}
.l_balloon ul li.type{font-size:18px}
.l_balloon ul li.name{font-size:28px}
.l_balloon ul li.ico img{width: 120px}
.hero-banner__img img{max-width: 100%;}
}
@media screen and (max-width: 600px){
.l_balloon ul li.spac_pc img{display: none}
.l_balloon ul li.spac_sp img{width: 100%; z-index: 10; margin-top: 30px; position: relative; display: inline}
.main_area dl.io_main{margin-top: 0px}
ul li.f-logo img{width: 150px; top: 10%}
.hero-banner .hero-ml{margin-left:30px;margin-top:20px}
.hero-banner__content{margin-top:40px;}
h1,.h1{font-size:45px}
.l_balloon ul li.type{font-size:18px}
.l_balloon ul li.name{font-size:28px}
.l_balloon ul li.ico img{width: 120px}
.hero-banner__img img{max-width: 100%;}
}
@media screen and (max-width: 480px){
.l_balloon ul li.spac_pc img{display: none}
.l_balloon ul li.spac_sp img{width: 100%; z-index: 10; margin-top: 30px; position: relative; display: inline}
.main_area dl.io_main{margin-top: 80px}
ul li.f-logo img{width: 150px; top: 10%}
.hero-banner .hero-ml{margin-left:10px;margin-top:20px}
.hero-banner__content{margin-top:40px;}
h1,.h1{font-size:40px}
.l_balloon ul li.type{font-size:16px}
.l_balloon ul li.name{font-size:24px}
.l_balloon ul li.ico img{width: 120px;margin-top:0px;}
.hero-banner__img img{max-width: 100%;}
}
.row-mgr{margin-right: 0px;}


dl.io_main dt.detail_pc{display:inline}
dl.io_main dt.detail_sp{display: none}
@media screen and (max-width: 767px){
dl.io_main dt.detail_pc{display:none}
dl.io_main dt.detail_sp{display: inline}
}
@media screen and (max-width: 600px){
dl.io_main dt.detail_pc{display:none}
dl.io_main dt.detail_sp{display: inline}
}
@media screen and (max-width: 480px){
dl.io_main dt.detail_pc{display:none}
dl.io_main dt.detail_sp{display: inline}
}