@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Lato:400,700');
@import url('https://fonts.googleapis.com/earlyaccess/notosansjapanese.css');
@import url('helper.css');
@import url('pe-icon-7-stroke.css');
html{height: 100%;font-size: 62.5%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
body {height: 100%;font: 400 1.6rem/1.5 'Lato','Noto Sans Japanese','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic', sans-serif;margin:0;}
b,strong{font-weight:bold}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
l,menu,ol,ul{margin:1em 0}
menu,ol,ul{padding:0 0 0 40px;list-style: none;}
nav ul,nav ol{list-style:none;list-style-image:none}
img{max-width: 100%;height: auto;vertical-align: middle;border:0;-ms-interpolation-mode:bicubic}
svg:not(:root){overflow:hidden}
table{border-collapse:collapse;border-spacing:0}
i{font-style: normal}
h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ol,ul,li{margin:0;padding:0;}
a{color:#000; text-decoration: none;-webkit-transition: all .35s ease-out;transition: all .35s ease-out;}
a:active,a:hover,a:focus{outline:0}
::-moz-selection {background: #000;color: #fff;}
::selection {background: #000;color: #fff;}
.cf:before,.cf:after {content:"";display:table;}
.cf:after {clear:both;}
.cf {zoom:1;}
.header--border{box-shadow: 0 0 1px #a8a28a;}
.header__inner{max-width: 1000px;margin: 0 auto;padding: 1.5rem;position: relative;box-sizing: border-box;}
.header__logo{width: 145px;line-height: 0;}
.header__company{display: none;}
.header__hero {position: relative;z-index: 0;background: #cc0000;overflow: hidden;}
.header__hero:before,.header__hero:after {display: block;content: "";position: absolute;z-index: -1;}
.header__hero:before {top: 0;left: 0;width: 0;height: 0;border-style: solid;border-width: 0 0 20vh 40vw;border-color: transparent transparent transparent #ec1111;}
.header__hero:after {bottom: 0;right:0;width: 0;height: 0;border-style: solid;border-width: 30vh 50vw 0 0;border-color: transparent #ec1111 transparent transparent;}
.header__hero-inner{max-width: 1200px;height: 450px;margin: 0 auto;padding: 2rem;background:url(../images/visual-ph.png) no-repeat center bottom;background-size:310px 251px;box-sizing: border-box;}	
.header__btn{width: 220px;margin: 1rem auto;}
.header__btn a{font-size: 1.4rem;font-weight: 700;text-align: center;color:#cc0000;padding: 1rem;border: 2px solid #fff;background: #fff;display: block;border-radius: 50px;}
.header__txt{font-size: 1rem;font-weight: bold; text-align: center;color:#fff;}
header nav {position: absolute;top:0;right:0;}
header .g_nav_list > li {padding: 0 1.2rem;}
header nav ul li {font-size: 1.4rem;;float: left;position: relative;}
header nav ul li span {width: 24px;height: 24px;line-height: 24px;text-align: center;background:#cc0000;font-weight: 700;vertical-align: middle;margin-top: -.5rem;color:#fff;display: inline-block;border-radius: 50%;}
header nav ul li a {display: inline-block;position: relative;}
header nav ul li a:not(:only-child):after,header nav ul li a:visited:not(:only-child):after {padding-left: 4px;content: ' ▾';}
header nav ul li ul li {min-width: 190px;}
header .nav-dropdown {background: rgba(255,255,255,.95);position: absolute;display: none;z-index: 1;box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);}
header .nav-dropdown > li + li {border-top: 1px solid #00abe3;}
header .nav-dropdown > li a {color: #00abe3;padding: 10px;background: transparent; display: block;}
header .nav-dropdown > li a:hover {color: #fff;background: rgba(4,191,239,.85);}
header .menu_ {width: 60px;height: 60px;display: none;position: absolute;top: 0;right: 0;z-index: 10000;}
header #nav-toggle {position: absolute;left: 15px;top: 15px;cursor: pointer;padding: 10px 35px 16px 0px;}
#nav-toggle span,#nav-toggle span:before,#nav-toggle span:after {cursor: pointer;width: 35px;height: 3px;background: #000;position: absolute;display: block;content: '';transition: all 300ms ease-in-out;}
#nav-toggle span:before {top: -10px;}
#nav-toggle span:after {bottom: -10px;}
#nav-toggle.active span {background-color: transparent;}
#nav-toggle.active span:before, #nav-toggle.active span:after {top: 0;}
#nav-toggle.active span:before {transform: rotate(45deg);}
#nav-toggle.active span:after {transform: rotate(-45deg);}
@media only screen and (max-width: 767px) {
header .menu_ {display: block;}
header .g_nav_list > li {padding: 0;}
header nav {width: 100%;}
header nav ul {/*height: 100vh;*/display: none;padding: 20px 0;background: rgba(204,0,0,.85);position: relative;z-index: 9999;}
header nav ul li {float: none;font-weight: 700;}
header nav ul li a {color:#fff;padding: 15px;line-height: 20px;display: block;}
header nav ul li ul li a {padding-left: 30px;}
header .nav-dropdown {position: static;margin: 0 15px; padding: 0;background: #fff;}
}
@media screen and (min-width:768px){
.header__hero-inner{max-width: 1200px;background:url(../images/visual-ph.png) no-repeat left bottom;background-size:400px 324px;}	
.header__hero-heading{max-width: 450px;position: absolute;top:30%;left:400px;}
.header__btn{width: 320px;margin-top: 2rem;}
.header__btn a{font-size: 1.6rem;font-weight: 700;}	
.header__btn a:hover{color:#fff;background:rgba(255,255,255,.25)}
.header__txt{font-size: 1.2rem;margin-top: 2rem;}
.header__txt br{display: none;}
.header__company{position: absolute;top:1.2rem;left:185px;display: block;}
.header__company > div{display: inline-block;vertical-align: middle;}
.company-name{font-size: 1.2rem;font-weight: 500;}
.company-jpx{width: 30px;margin-left: 1rem;}
header nav {top:1.8rem;}
header .g_nav_list {display: block !important;}
header nav ul li:nth-child(2) a {color:#cc0000;}
header nav ul li a {color:#000;position: relative;display: inline-block;text-decoration: none;}
header nav ul li a:after {position: absolute;bottom: -4px;left: 0;content: '';width: 100%;height: 2px;background: #000;transform: scale(0, 1);transform-origin: right top;transition: transform .3s;}
header nav ul li a:hover:after {transform-origin: left top;transform: scale(1, 1);}
}
@media screen and (min-width:1024px){
.header__hero-inner{min-height: 500px;background-size:580px 470px;position: relative;}	
.header__hero-heading{max-width: 580px;left:600px;padding-right: 2rem}
.header__btn{margin-top: 3.5rem;}
.header__btn a{font-size: 2rem;}
.header__txt{font-size: 1.4rem;}
}
main{display: block;}
main > section{padding: 4rem 0;position: relative;}
.section-inner{max-width: 1000px;margin: 0 auto;padding: 0 1.5rem; position: relative;}
.section-bg1{background: #f5f5f5;}
.section-bg2{background: #cc0000;}
.section-inner__heading{font-size: 2.8rem;line-height: 1.3; font-weight: 200;text-align: center;}
.section-inner__heading:after{content:"";width: 80px;height: 3px;background: #cc0000;margin: 2.5rem auto;display: block;}
.section-inner__heading--column{color:#fff;}
.section-inner__heading--column:after{background: #fff;}
.section-inner__heading--noborader:after{display: none;}
.section-inner__heading span{vertical-align: middle;position: relative;top:-.5rem;}
.about-txt{font-size: 1.4rem;}
.about-txt span{font-size: 1.6rem;font-weight: 700;color:#2568d7;border-bottom: 1px solid #2568d7;}
.about-ph{margin-top: 2.5rem;text-align: center;}
.flow{text-align: center;}
.p-txt{font-size: 1.7rem;font-weight: 700;text-align: center;color:#cc0000;margin-top: 2.5rem;}
.p-txt span{font-size: 2.2rem;}
.illust-ph{width: 90px;margin: -9rem 0 0 0;}
.form-inner{padding: 2rem;background: #fff8e5;border: 1px solid #e9dfc3;}
.form-inner__txt p{font-size: 1.3rem;line-height: 1.6;}
.form-inner__txt p + p{margin-top: 2rem;}
.form-inner__block{margin-top: 2rem; padding: 1.5rem;background: #fff; box-shadow:0px 0px 6px 0px rgba(0,0,0,.35);position: relative;}
.form-inner__block dl {width: 100%;margin-bottom: 3rem;}
.form-inner__block dt {font-size: 1.3rem;margin-bottom: .5rem;}
.form-inner__block input[type="text"],.form-inner__block input[type="email"],
.form-inner__block input[type="tel"],.form-inner__block textarea {width: 100%;height: 35px;}
.form-inner__block textarea {height: 200px;}
.form-inner__block input[type="text"] {-webkit-appearance: none;}
.form-inner__block input:focus,.form-inner__block textarea:focus{outline: none;}
.form-inner__block input[type="text"],.form-inner__block input[type="email"],
.form-inner__block input[type="tel"],.form-inner__block textarea{font-size: 1.2rem;padding:.5rem;box-sizing:border-box;border: none;background: #f5f5f5;-webkit-appearance: none; appearance: none;}
.form-inner__block textarea {resize: vertical;-webkit-appearance: none;}
.form-inner__block select{width: 100%;height: 35px;font-size: 1.2rem;line-height: 1.2rem; padding: 5px;outline:none;text-indent: 0.01px;text-overflow: '';border: none;background: #f5f5f5;vertical-align: middle;-webkit-appearance: button;-moz-appearance: button;appearance: button;border-radius: 0;}
.form-inner__block select option{color: #000;}
.form-inner__block select::-ms-expand {display: none;}
.form-inner__block select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #828c9a;}
.form-inner__block .select__wrap {width: 100%;position:relative;}
.form-inner__block .select__wrap:before {z-index: 1; position: absolute;right: 15px;top: 0;content: "\f0d7";font-family: "FontAwesome";line-height: 35px; color: #000;pointer-events: none;}
.form-inner__block label {font-size: 1.2rem; margin-right: 1rem;}
.form-inner__block li {font-size: 1.2rem;}
.form-inner__block li + li {margin-top: 1rem;}
.form-inner__block li input[type="radio"] {margin-right: 1rem;display: none;}
.form-inner__block li input[type="radio"]:checked + label:after {content: '';width: 10px;height: 10px;position: absolute;top: 7px;left: 7px;background: #000;border-radius: 50%;}
.form-inner__block li label {padding: 0 0 0 30px;line-height: 20px;display: inline-block;cursor:pointer;position: relative;}
.form-inner__block li label:before {content: '';width: 22px;height: 22px;position: absolute;top: 0;left: 0;background: #f5f5f5;border-radius: 50%;border: 1px solid #ccc;}
.form-inner__block input[type="submit"] {width: 100%;font-size: 1.4rem;font-weight: 700; color:#fff;text-align: center;padding: .85rem;background: #cc0000;box-sizing: border-box;border: 1px solid #cc0000;border-radius: 50px;-webkit-appearance: none;}
@keyframes anime{0%{transform:scale(.95); opacity:1}90%{opacity:.1}to{transform:scale(1.2,1.5); opacity:0}}
.form-inner__block .submit {position: relative;transition: .2s;z-index: 99;}
.form-inner__block .submit:before, .form-inner__block .submit:after {content: "";position: absolute;z-index: -1;width: 100%;height: 100%;top: 0;left: 0;border-radius: 25px;background: #ec1111;transform: translate3d(0,0,0);-webkit-transition: all .35s ease-out;transition: all .35s ease-out;}
.form-inner__block .submit:before {animation: anime 2s ease-out infinite;}
.form-inner__block .submit:after {animation: anime 2s ease-out 1s infinite;}
.form-inner__block .submit:hover:before, .form-inner__block .submit:hover:after {background:transparent;}
.column-inner{padding: 2rem;background: #fff;}
.column-quote{margin-top: 3.5rem; padding: 1.5rem;background: #f5f5f5;}
.column-heading{font-size: 1.6rem;color:#666;}
.column-heading a{color:#cc0000;text-decoration: underline;}
.column-heading span{font-size: 1.4rem;display: block;}
.column-quote p{color:#666;}
.column-txt{font-size: 1.4rem;line-height: 1.8; margin-top: 2rem;}
.col{padding: 4rem 2rem;}
.col--bg {background: #f5f5f5;}
h1 + .col{padding-top: 0;}
.col-inner{max-width: 1000px;margin: 0 auto;padding: 0 1.5rem;}
.col-block {margin-top: 3rem;}
.col-title {font-size: 2rem;}
.col-title:after{content:"";width: 80px;height: 1px;background: #000;margin: 2rem 0;display: block;}
.col-txt {font-size: 1.5rem;line-height: 1.8;}
.col-illust{width: 75px;position: absolute;top:-5rem;right:1rem;}
.tool-inner > div{padding: 1.5rem;background:#fff; box-shadow:0px 0px 6px 0px rgba(0,0,0,.35);box-sizing: border-box;}
.tool-inner > div + div{margin-top: 2rem;}
.tool-inner h2{font-size: 1.8rem;text-align: center;}
.tool-inner ul{margin: 2rem 0;}
.tool-inner li{font-size: 1.4rem;}
.tool-inner li + li{margin-top: .5rem;}
.main__btn{width: 250px;margin: 1rem auto 0;}
.main__btn a{font-size: 1.4rem;font-weight: 700;text-align: center;color:#fff;padding: 1rem;background: #cc0000;display: block;border-radius: 50px;position: relative;transition: .2s;z-index: 99;}
.main__btn a:before,.main__btn a:after {content: "";position: absolute;z-index: -1;width: 100%;height: 100%;top: 0;left: 0;border-radius: 25px;background: #cc0000;transform: translate3d(0,0,0);-webkit-transition: all .35s ease-out;transition: all .35s ease-out;}
.main__btn a:before {animation: anime 2s ease-out infinite;}
.main__btn a:after {animation: anime 2s ease-out 1s infinite;}
.main__btn a:hover:before, .main__btn a:hover:after {background:transparent;}
.contact-list{margin-top: 3rem; padding: 0 1.5rem; display: flex;display:-webkit-flexbox;display:-ms-flexbox;justify-content: space-between;-webkit-justify-content: space-between;-ms-flex-pack: justify;}
.contact-list > li{font-size: 1.2rem;width: 48.5%;text-align: center;}
.contact-list > li a{font-weight: 600;padding: 1rem;border: 1px solid #cc0000;display: block;position: relative;z-index: 6;}
.contact-list .contact-list--app{color:#fff;background: #cc0000;}
.contact-list .contact-list--mail{color:#cc0000;background: #fff;}
.footer__inner{max-width: 1000px;margin: 0 auto;padding: 4rem 1.5rem;}
.footer__inner > h3{font-size: 1.8rem;font-weight: 200;color:#cc0000;}
.footer__inner > h3:after{content:"";width: 80px;height: 1px;background: #cc0000;margin: 2rem auto;display: block;}
.footer__inner > p{font-size: 1.4rem;line-height: 1.8;}
.footer__inner > p + p{margin-top: 2rem;}
footer p.copy{font-size: 1.2rem;color:#fff;text-align: center;padding: 1rem;background:#cc0000;}
@media screen and (min-width:768px){
.section-inner__heading br{display: none;}
main > section{padding: 8rem 0;}
.section-inner__heading{font-size: 3.6rem;}
.section-inner__heading:after{width: 100px;margin: 3.5rem auto;}
.about-txt{font-size: 1.6rem;line-height: 2; text-align: center;}
.about-txt span{font-size: 2rem;}
.about-ph{margin-top: 3.5rem;}
.p-txt{font-size: 2.8rem;margin-top: 3.5rem;}
.p-txt span{font-size: 4rem;}
.illust-ph{width: 120px;display: block;margin: -12rem 0 0 5%;}
.form-inner{padding: 3rem; display: flex;display:-webkit-flexbox;display:-ms-flexbox;justify-content: space-between;-webkit-justify-content: space-between;-ms-flex-pack: justify;}
.form-inner__txt{width: 50%;}
.form-inner__txt p{font-size: 1.5rem;font-weight: 700;}
.form-inner__txt p + p{margin-top: 2rem;}
.form-inner__block{width: 45%; margin-top: 0; padding: 2rem;box-sizing: border-box;}
.form-inner__block dl {display: table;}
.form-inner__block dt,.form-inner__block dd {display: table-cell;vertical-align: middle;}
.form-inner__block dt {width: 120px;}
.form-inner__block input[type="text"],.form-inner__block input[type="email"],
.form-inner__block input[type="tel"],.form-inner__block textarea{font-size: 1.3rem;}
.form-inner__block label {font-size: 1.4rem;font-weight: 600;}
.form-inner__block .submit {width: 250px;margin:0 auto;}
.form-inner__block input[type="submit"] {-webkit-transition: all .35s ease-out;transition: all .35s ease-out;}
.column-inner{padding: 3rem;}
.column-quote{margin-top: 4.5rem; padding: 2rem;}
.column-heading{font-size: 2rem;}
.column-heading a:hover{text-decoration: none;}
.column-heading span{font-size: 1.8rem;display: inline-block;}
.column-txt{font-size: 1.6rem;}
.col{padding: 5rem 0;}
.col-fl{float: left;}
.col-fr{float: right;}
.col-block {width: 60%; margin-top: 0;}
.col-ph {width: 35%;}
.col-title {font-size: 2.4rem;margin-bottom: 2rem;}
.col-txt {font-size: 1.6rem;}
.col-illust{width: 120px;right:2rem;}
.tool-inner{display: flex;display:-webkit-flexbox;display:-ms-flexbox;justify-content: space-between;-webkit-justify-content: space-between;-ms-flex-pack: justify;}
.tool-inner > div{width: 32%;padding: 2rem;}
.tool-inner > div + div{margin-top: 0;}
.main__btn{width: 380px;margin: 5rem auto 0;}
.main__btn a{font-size: 1.6rem;font-weight: 700;}	
.slide-content {opacity: 0;}
.slidein {opacity: 1;animation-name: slidein;-webkit-animation-name: slidein;animation-duration: 1s;-webkit-animation-duration: 1s;visibility: visible;}
 @keyframes slidein {
 0% {opacity: 0.0;transform: translateY(50px);}
 100% {opacity: 1;transform: translateY(0);}
}
@-webkit-keyframes slidein {
 0% {opacity: 0.0;transform: translateY(50px);}
 100% {opacity: 1;transform: translateY(0);}
}
.contact-list{max-width: 840px;margin: 4rem auto 0;}
.contact-list > li{font-size: 1.6rem;}
.contact-list > li a{padding: 1.5rem;}
.contact-list .contact-list--app:hover {color:#cc0000;background: transparent;}
.contact-list .contact-list--mail:hover {color:#fff;background: #cc0000;}
.footer__inner{padding: 8rem 1.5rem;}
.footer__inner > h3{font-size: 2.8rem;text-align: center;}
.footer__inner > h3:after{margin: 3rem auto;}
.footer__inner > p{font-size: 1.6rem;letter-spacing: 1px;}
footer p.copy{font-size: 1.4rem;letter-spacing: 1px;}
}
@media screen and (min-width:950px){
.illust-ph{margin-left: 10%;}
.col-illust{width: 165px;right:3rem;}
}
@media screen and (min-width:1024px){
.section-inner__heading {font-size: 4.6rem;}
}