*{outline: none;-webkit-box-sizing: border-box;box-sizing: border-box;}
h1,h2,h3.h4.h5.h6{margin: 0; padding: 0; line-height: 1}
a:hover,a:focus{ text-decoration: none; outline: none;}
p{margin: 0; padding: 0; line-height: 1}
ul,ul li{padding: 0; margin: 0;}
ul li{ list-style-type: none;}
button {    outline: none !important;}
a{text-decoration: none;}
body{    font-family: 'HiraKakuPro-W3-AlphaNum';}
.btn-primary.focus, .btn-primary:focus { box-shadow: none; }
.container{max-width:1050px; margin: auto; width: 100%;}

/* header start */
header {
    float: left;
    width: 100%;
    background-image: url(../images/header-bg.png);
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    padding-bottom: 90px;
}

@supports (background-image: url(../images/header-bg.webp)) {
    header {
        background-image: url(../images/header-bg.webp);
    }
}
.header-top { float: left; width: 100%; padding-bottom: 85px;}
.header-top nav.navbar { padding: 0; background-color: transparent !important; align-items: flex-start; }
.header-top a.navbar-brand { padding: 0; }
.header-top a.navbar-brand img { max-width: 250px; width: 100%; }
.header-top ul.navbar-nav li a { color: #fff !important; }
.header-top .navbar-light .navbar-toggler-icon{ background-color: #fff; border-radius: 6px;}
.header-tell-wrapper a{ color: #fff; padding-right: 20px; font-size: 44px;}
.header-tell-wrapper a span{ font-size: 30px;}

.header-bottom { float: left; width: 100%; color: #fff; margin: auto; /*padding: 0 10px;*/}
.header-bottom-inner { float: left; width: 100%; text-align: center; }
.header-bottom-inner h1{ font-size: 40px; line-height: 60px; text-shadow: 2px 2px #000; margin-bottom:30px;}
.header-bottom-inner-color{ background-color: #75bb1a; width: 100%;padding: 5px;margin: 0 auto 10px;}
.header-bottom-inner h4{ max-width:250px; color: #fdff61; font-size: 38px; line-height: 60px;}
.header-bottom-inner h4 span{ color: #fff; font-size: 26px; }
.header-bottom-inner h5{ max-width: 540px; color: #fff; font-size: 26px;}
.header-bottom-inner h6{ max-width: 400px; color: #fff; font-size: 26px;}
.collapse:not(.show) { display: block; float: left; width: 100%; position: relative; }
.header-tell-wrapper { position: absolute; top: 0; right: 0; }
/* header end */

/* header logo start */
.header-logo{ float: left; width: 100%; background-color: #232323; padding:10px;}
.header-logo .header-logo-title h1{ font-size: 28px; line-height: 48px; text-align: center; color: #fff; position: relative; padding-bottom: 10px;}
.header-logo .header-logo-title h1::after, .header-logo .header-logo-title h1::before{ content: ''; width: 25%; display: block; border-top: 1px solid #464646; position: absolute; top: 40%; margin: 0 5px;}
.header-logo .header-logo-title h1::after{ left: 0;}
.header-logo .header-logo-title h1::before{ right: 0;}

.header-logo-content{ float: left; width: 100%;}
.header-logo-content ul li{padding: 0 5px; float: left; width: 14.28%; }
.header-logo-content ul li a img{ width: 100%;}
/* header logo end */

/* wizard start */
.wizard{ float: left; width: 100%; background-color: #fff; }
.wizard-inner{ float: left; width: 100%; padding: 80px 0px;}
.wizard-top{ float: left; width: 100%; color: #fff; text-align: center; font-size: 32px; line-height:60px; margin-bottom: 40px;}
.wizard-top h1{ max-width:770px; width: 100%; margin-bottom: 15px;}
.wizard-top h1 span{color: #fdff61;}
.wizard-top h2{ max-width: 420px; width: 100%;font-size: 2.5rem;}

.wizard-bottom{ float: left; width: 100%;     border: 3px solid #232323; border-radius: 6px;}
.wizard-title{ float: left; width: 100%;}
.wizard-title h1{ background-color:#232323; color: #fff; text-align: center; font-size: 26px; line-height: 48px; font-family: 'HiraKakuPro-W6-AlphaNum'; font-weight: 600; padding: 20px;}
.wizard-body{ float: left; width: 100%; padding: 45px;}

.stepwizard-title{ float: left; width: 100%; text-align: center;}
.stepwizard-title h1{ font-size: 15px; line-height: 48px; color: #333333; margin-bottom:40px;}
.stepwizard-row { display: block; width: 100%; margin: auto; text-align: center; max-width: 500px;}
.stepwizard-step p { margin-top: -22px; font-weight: bold; margin-bottom: 5px;     text-transform: uppercase; font-size: 18px;}
.stepwizard { display: table; width: 100%; position: relative; margin-bottom: 40px;}
.stepwizard-step button[disabled] { opacity: 1 !important; filter: alpha(opacity=100) !important; }
.stepwizard-row:before {     top: 0; bottom: 0; position: absolute; content: " "; width: 200px; left: 0; height: 1px; background-color: #ccc; right: 0; margin: auto; }
.stepwizard-step { display:inline-block; padding: 0 15px; text-align: center; position: relative; }
.btn-circle { width: 30px; height: 30px; text-align: center; padding: 0; font-size: 12px; line-height: 30px; border-radius: 15px; background-color: #c5c5c5; border: 0; color: #fff;}
.btn-circle.btn-primary{ background-color: #75bb1a;}

.wizard-body .form-group{ 
    border-top: 1px solid #e0e0e0; 
    display: flex; 
    flex-direction: column; 
    width: 100%; 
    padding: 20px 50px; 
    margin: 0;
}
.wizard-body .form-group.step1 label{ 
    padding-right: 20px; 
    min-width: 200px; 
    margin-bottom: 8px;
    font-weight: bold;
}
.wizard-body .form-group.step2 label{ 
    padding-right: 20px; 
    min-width: 135px; 
    margin-bottom: 8px;
    font-weight: bold;
}
.wizard-body .form-group.step3 label{ 
    padding-right: 20px; 
    min-width: 135px; 
    margin-bottom: 8px;
    font-weight: bold;
}
.wizard-body .form-control{ 
    display: block; 
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #ddd;
    border-radius: 8px;
    font-size: 16px;
    transition: border-color 0.3s ease;
    height: auto;
    min-height: 48px;
    line-height: 1.4;
}
.wizard-body .form-control:focus{ 
    border-color: #75bb1a;
    outline: none;
}
#email{width: 100%;}
.step2_label{
    font-weight: normal;
    margin-left: 8px;
    cursor: pointer;
}
.step2_consult{width: 20%;float: left; margin-bottom: 8px;}
.step2_consult1{width: 35%;float: left; margin-bottom: 8px; padding: 4px 0;}
.step2_consult2{width: 25%;float: left; margin-bottom: 8px; padding: 4px 0;}
.step2_consult3{width: 20%;float: left; margin-bottom: 8px; padding: 4px 0;}
.step2_radio{
    vertical-align: middle; 
    width: 18px; 
    height: 18px; 
    margin-right: 8px;
    cursor: pointer;
}
.detail_content{
    width: 100%;
    height: 120px;
    padding: 12px 16px;
    border: 2px solid #ddd;
    border-radius: 8px;
    font-size: 16px;
    resize: vertical;
    transition: border-color 0.3s ease;
    line-height: 1.4;
    font-family: inherit;
}
.detail_content:focus{ 
    border-color: #75bb1a;
    outline: none;
}
/*#pc_step3_last{display: block;}
#sp_step3_last{display: none;}*/
.wizard-body .setup-content { float: left; width: 100%; }
.wizard-body button.nextBtn { 
    background-color: #75bb1a; 
    color: #fff; 
    border-radius: 50px; 
    height: 60px; 
    width: 100%; 
    max-width: 250px; 
    border: 0; 
    position: relative; 
    display: block; 
    margin: auto;
    font-size: 16px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}
.wizard-body button.nextBtn:hover{ 
    background-color: #5a9a0f;
}
.wizard-body button.nextBtn:disabled{ 
    background-color: #ccc;
    cursor: not-allowed;
}
.wizard-body button.nextBtn::after{ 
    position: absolute; 
    content: "\f054";  
    font-family: "Font Awesome 5 Free"; 
    font-weight:600;      
    top: 50%; 
    margin-top: -14px; 
    right: 20px;
}

/* エラーメッセージのスタイル統一 */
#nameError, #phoneError, #emailError, #nameError2, #phoneError2, #emailError2 {
    color: #dc3545;
    font-size: 14px;
    margin-top: 7px;
    margin-bottom: 0;
    display: none;
}
.wizard-body .form-group.last-group{float: left; width: 100%; border-bottom: 1px solid #e0e0e0; margin-bottom: 30px;}
/* wizard end */
/* reason start */
.reason {
    float: left;
    width: 100%;
    padding: 100px 0;
    background-image: url('../images/reason-bg.png'); /* �f�t�H���g: PNG */
}

@supports (background-image: url('../images/reason-bg.webp')) {
    .reason {
        background-image: url('../images/reason-bg.webp'); /* WebP ��D�� */
    }
}
.reason-inner{ float: left; width: 100%;}
.reason-title{ float: left; width: 100%; text-align: center;}
.reason-title h1{ font-size: 32px; line-height: 48px; color: #333333; font-family: 'HiraKakuPro-W6-AlphaNum'; font-weight: 600;}
.reason-title span{ font-size: 16px; line-height: 48px; color: #7bbe23;   font-family: 'Raleway-Medium';     margin-bottom: 10px; float: left; width: 100%; }

.reason-top{ float: left; width: 100%;}
.reason-inner-block{ float: left; width: 100%; height: 100%; background-color: #fff; padding: 30px; border-radius: 10px;}

.reason-inner-block-top{ float: left; width: 100%; display: table; min-height: 145px;}
.reason-inner-block-top > div{ display: table-cell; vertical-align: top; color:#333333; padding-bottom: 20px;}
.reason-inner-block-top div span{display: block; height: 35px; width: 35px; background-color: #75bb1a; color: #fff; text-align: center; border-radius: 50px; line-height: 35px; font-size: 18px; font-weight: 600; margin-bottom: 15px;}
.reason-inner-block-top div h2{ font-size: 24px; line-height: 36px;   font-family: 'HiraKakuPro-W6-AlphaNum'; font-weight: 600;}
.reason-inner-block-top div p{ font-size: 15px; line-height: 28px;}
.reason-inner-block-top div img{ float:right;}

.reason-bottom{clear: both;width: 100%;}
.reason-bottom p{ float: left; width: 100%; min-height: 120px;}
.reason-inner-block-bottom{ float: left; width: 100%;}
.reason-inner-block-bottom p{ font-size: 15px; line-height: 24px; font-weight:500}
/* reason end */

/* our policy start */
.our-policy {
    float: left;
    width: 100%;
    padding: 90px 0 55px;
    background-image: url('../images/our-policy-bg.png'); /* �f�t�H���g: PNG */
    background-repeat: no-repeat;
    background-size: cover;
}

@supports (background-image: url('../images/our-policy-bg.webp')) {
    .our-policy {
        background-image: url('../images/our-policy-bg.webp'); /* WebP ��D�� */
    }
}
.our-policy-inner{ float: left; width: 100%; max-width: 430px;}
.our-policy-inner h2{ font-size: 44px; line-height: 48px; color: #333333; position: relative; margin-bottom: 40px; font-weight: bold;}
.our-policy-inner h2::after{ content: ''; border-top: 5px solid #75bb1a; width: 40px; height: 5px; display: block; position: absolute; bottom: -20px;}
.our-policy-inner h2 span{ font-size: 18px; line-height: 30px; padding-left: 20px; vertical-align:middle;}
.our-policy-inner p{ font-size: 15px; line-height: 30px; padding-bottom: 35px;}
/* our policy end */

/* about start */
.about {
    float: left;
    width: 100%;
    background-image: url('../images/about-bg.png'); /* �f�t�H���g: PNG */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    height: 1500px;
}

@supports (background-image: url('../images/about-bg.webp')) {
    .about {
        background-image: url('../images/about-bg.webp'); /* WebP ��D�� */
    }
}
.about-inner{ float: left; width: 100%; padding: 100px 10px 20px; color: #333333; text-align: center; font-weight: 500;}
.about-inner h1{ font-size: 44px; line-height: 48px; position: relative;  margin-bottom:10px; font-weight: bold;}
.about-inner h2{ font-size: 15px; line-height: 30px;  margin-bottom: 50px; position: relative;}
.about-inner h2::after{content: ''; border-top: 5px solid #75bb1a; width: 40px; height: 5px; display: block; position: absolute; bottom: -20px; left: 0; right: 0; margin: auto;}
.about-inner h3{ font-size: 15px; line-height: 30px; padding-bottom: 35px;}
.about-inner p{ font-size: 15px; line-height: 30px;}
.about-bottom{ float: left; width: 100%;}
.about-bottom img{ width: 100%;} 
#pc_about_us{display: block;}
#sp_about_us{display: none;}
#pc_reason{display: block;}
#sp_reason{display: none;}
/* about end */

/* contact start */
.contact{ float: left; width: 100%; padding: 100px 0; background-color: #fff;}
.contact-inner{ float: left; width: 100%;}
.contact-title{ float: left; width: 100%; margin-bottom:70px;}
.contact-title h1{ font-size: 31px; line-height: 50px; color: #333333; margin-bottom: 40px; text-align: center;}
.contact-title span{text-align: center;}
.contact-title a, .message-inner a{ padding: 20px 35px; background-color: #75bb1a; color: #fff; width: 100%; max-width: 400px; border-radius: 50px; margin: auto; display: block; position: relative;}
.contact-title a::after, .message-inner a::after{ position: absolute; content: "\f054";  font-family: "Font Awesome 5 Free"; font-weight:600;      top: 50%; margin-top: -14px; right: 20px;}
.contact-title a span, .message-inner a span{ background-color: #fff; color: #75bb1a; padding: 10px; margin-right: 10px;}

.slider-wrapper{ float: left; width: 100%;}
.slider-wrapper .slider img{ width: 100%;}
.slider-wrapper .slider-nav-thumbnails{ float: left; width: 100%;}
.slider-wrapper .slider-nav-thumbnails > div { width: 100%; }
.slider-wrapper .slider-nav-thumbnails > div img{ width: 100%; padding: 0 1px;}

.slider-wrapper .slick-slider{ position: relative;}
.slider-wrapper .slick-slider .slick-arrow{z-index: 10; top: 50%; font-size: 0;}
.slider-wrapper button.slick-prev.slick-arrow:before{content: "\f053"; left:-40px; }
.slider-wrapper button.slick-next.slick-arrow:after{content: "\f054"; right:-40px; }
.slider-wrapper button.slick-prev.slick-arrow:before, .slider-wrapper button.slick-next.slick-arrow:after{font-size:24px; font-family: "Font Awesome 5 Free"; font-weight:600; position:absolute;z-index: 11; top: 50%; line-height: 90px;padding:0; text-align: center;-webkit-transition: ease-in-out 300ms; -o-transition: ease-in-out 300ms; transition: ease-in-out 300ms; border: 0;     
    background-color: #75bb1a; color: #fff; height: 90px; width: 40px; margin-top: -30px; }
.slider-wrapper button.slick-prev.slick-arrow,button.slick-next.slick-arrow {font-size: 0;border: 0;background-color: transparent;box-shadow: none;outline: 0;}
#pc_contact_title{display: block;}
#sp_contact_title{display: none;}
/* contact end */

/* message start */
.message {
    float: left;
    width: 100%;
    background-image: url('../images/message-bg.png'); /* �f�t�H���g: PNG */
    background-repeat: no-repeat;
    background-position: top left;
    /* height: 600px; */ /* �R�����g�A�E�g����Ă��邽�߁A���̂܂܈ێ� */
}

@supports (background-image: url('../images/message-bg.webp')) {
    .message {
        background-image: url('../images/message-bg.webp'); /* WebP ��D�� */
    }
}
.message-inner{ float: right; width: 100%; max-width: 510px;  padding: 40px 0 24px 40px; background-color: #fff; margin-top: 80px; color: #333333;}
.message-inner h1{ font-size: 43px; line-height: 47px; font-weight:bold;}
.message-inner h2{ font-size: 15px; line-height: 30px; position: relative; margin-bottom:30px;}
.message-inner h2::after{ content: ''; border-top: 5px solid #75bb1a; width: 40px; height: 5px; display: block; position: absolute; bottom: -10px;}

.message-inner h3{ font-size: 15px; line-height: 27px;margin-bottom: 2rem;}
.message-content{margin-bottom: 2rem;}
.message-content h4{ font-size: 15px; line-height: 27px;}
.message-inner p{ font-size: 15px; line-height: 27px;}
.message-inner a{ margin-top: 25px;}
/* message end */

/* official site start */
.official-site{ float: left; width: 100%; padding: 100px 0;}
.official-site-inner{ float: left; width: 100%; border: 3px solid #474747; border-radius: 6px;} 
.official-site-content{ float: left; width: 37%; padding: 20px 20px 0;}
.official-site-content h1{ max-width: 200px; font-size: 26px; line-height: 40px; color: #fff; margin-bottom: 10px; padding: 0 5px;}
.official-site-content h2{ max-width: 325px; font-size: 26px; line-height: 40px; color: #fff; padding: 0 5px; margin: 0; text-align: center;}
.official-site-content h3{ font-size: 40px; line-height: 48px;}
.official-site-content span{ padding-right: 10px; margin: 0;}
.official-site-content img{ font-size: 15px; line-height: 48px;}
.official-site-img{ float: left; width:63%;}
.official-site-img img{ width: 100%;}
/* official site end */

/* footer start */
footer{ float: left; width: 100%; padding: 30px 10px; background-color: #383838; color: #fff; text-align: center;}
.footer span{ font-size: 12px;}
/* footer end */
.mobile-call,.official-site-mobile, .about-bottom{ display: none;}

.thanks_pb{padding-bottom: 0;}
/* responsive start */
@media(max-width:1199px)
{
    header{ padding-bottom:50px;}
    .header-top a.navbar-brand{ margin-right: 5px;}
    .header-top a.navbar-brand img { max-width: 200px;}
    .header-tell-wrapper a { padding-right: 10px; font-size: 24px;}
    .header-tell-wrapper a span { font-size: 18px; }
    .header-top{ padding-bottom: 65px;}
    .header-logo .header-logo-title h1 { font-size: 24px; }
    .header-logo .header-logo-title h1::after, .header-logo .header-logo-title h1::before{ width: 25%; top: 40%;}
    .header-bottom-inner h1 { font-size: 36px; line-height: 48px;}

    .slider-wrapper button.slick-next.slick-arrow:after{ right: 0;}
    .slider-wrapper button.slick-prev.slick-arrow:before{ left: 0;}
    .contact-title{ margin-bottom: 60px;}
    .official-site-content{ padding: 10px 10px 0;}
    .about{ height: 1430px;}
    .official-site, .reason, .contact, .our-policy{ padding: 80px 0;}
    .about-inner{ padding: 80px 10px 20px;}
}

@media(max-width:991px)
{
    /* header */
    .collapse:not(.show) { width: auto; padding-right: 120px; }
    ul.navbar-nav { display: block; }
    ul.navbar-nav li.nav-item { float: left; }
    a.nav-link { font-size: 14px; }
    .header-top a.navbar-brand img { max-width: 170px; }
    .header-tell-wrapper a{ font-size: 14px; }
    .header-tell-wrapper a span { font-size: 12px; }

    .header-top { padding-bottom: 40px; }
    .header-bottom-inner h1 { font-size: 28px; line-height: 42px; }
    .header-bottom-inner h4{ line-height: 42px;}
    header { padding-bottom: 30px; }
    /* header end */

    .header-logo .header-logo-title h1 { font-size: 20px; }
    .header-logo .header-logo-title h1::after, .header-logo .header-logo-title h1::before { width: 23%;}
    .wizard-inner{ padding: 50px 0;}
    .wizard-top h1{ font-size: 32px;}
    .wizard-top{ margin-bottom: 20px;}
    .wizard-body{ padding: 30px;}
    .wizard-body .form-group{ padding: 20px;}
    .wizard-body .form-group label{ min-width:100px; padding-right:10px; font-size: 13px;}
    .official-site, .reason, .contact, .our-policy { padding: 60px 0; }
    .reason-inner-block-top div h2{ font-size: 18px; line-height:24px; }
    .reason-inner-block{ padding: 10px;}
    .reason-inner-block-top{ min-height: 110px;}
    .reason-inner-block-bottom p{ font-size: 14px;}
    .reason-bottom p{ min-height: 150px;}
    .about { height: 850px; }
    .contact-title h1 { font-size: 28px; line-height: 36px;}
    .contact-title { margin-bottom: 40px; }
    .message-inner { padding: 40px 20px 25px 20px;}

    .official-site-content { padding: 5px; }
    .official-site-content h1 { font-size: 20px; line-height: 30px; max-width: 150px;}
    .official-site-content h2 { font-size: 20px; line-height: 30px; padding: 0 5px; }
    .official-site-content h3 { font-size: 24px; line-height: 28px; text-align: center; }
    .official-site-content span { font-size: 14px; padding-right: 0;}
}

@media(min-width:768px) and (max-width:991px)
{
    /* .about{ background-image: url('../images/about-bg-top.png'); }
    .about-bottom{ display: block;}
     */
     .about-inner h3 { font-size: 12px; line-height: 18px; padding-bottom: 5px; }
     .about-inner p { font-size: 12px; line-height: 18px; }

}

@media(max-width:767px)
{
    .header-top a.navbar-brand img { max-width: 150px; }
    .header-top nav.navbar{ position: relative;}
    .collapse:not(.show) { position: absolute; left: 155px; padding: 0;}
    .header-tell-wrapper { top: 50px; left: 0; }
    .header-top ul.navbar-nav li a { font-size: 15px; padding: 5px 0; line-height: 1; }
    .header-tell-wrapper a { font-size: 24px; }
    .header-tell-wrapper a span{ font-size: 18px; }
    .header-bottom-inner h1{ padding: 0 20px;}
    .header-bottom-inner h5{ font-size: 20px;}
    .header-bottom-inner h6{ font-size: 20px;}
    .header-logo .header-logo-title h1 { font-size: 18px; }
    .header-logo .header-logo-title h1::after, .header-logo .header-logo-title h1::before { width: 18%; }

    .wizard-top h1,.wizard-top h2 { font-size: 24px; }
    .wizard-top h1{ max-width: 320px;}
    .wizard-top h2 { max-width: 280px; }
    .wizard-title h1{ font-size: 24px; line-height: 36px; padding: 5px;}
    .wizard-body { padding: 15px 0; }
    .stepwizard-title h1{ line-height: 24px;font-size: 13px;}
    .wizard-body .form-group { padding: 10px 0; }
    .wizard-body .form-group label, .wizard-body .form-group input{ float: left; width: 100%;}
    .step2_label{width: 80% !important;}
    .step2_radio{width: auto !important; margin: 4px 10px 10px 10px;}
    .reason-title h1 {     font-size: 24px; line-height: 36px;}
    .reason-inner-block-top div h2 { font-size: 14px;}
    .official-site, .reason, .contact, .our-policy { padding: 40px 0; }
    .our-policy{ background-position: bottom center;}
    /* .about{height: 1400px !important; background-position: bottom center; } */
    .slider-wrapper button.slick-prev.slick-arrow:before, .slider-wrapper button.slick-next.slick-arrow:after{ margin-top: -45px;}
    .message-inner{ max-width:720px; margin-top: 100px; padding: 40px 20px 35px 20px; }
    .official-site-content{ width: 100%; margin-bottom: 15px;}
    .official-site-img{ width: 100%;}
    .official-site-content h2, .official-site-content h1{ margin: 0; margin-bottom: 10px;}
    .official-site-content h3{ text-align: left;}
    .about-inner { padding: 40px 10px 20px; }
    .about-inner h3 { font-size: 14px; line-height: 28px; padding-bottom: 15px; }
    .header-logo-content ul li{ width: 25%; margin-bottom: 15px;}
    .slider-wrapper button.slick-prev.slick-arrow:before, .slider-wrapper button.slick-next.slick-arrow:after{ height: 70px; line-height: 70px; margin-top: -35px;}

    /*  */
    .hidden-mobile{ display: none !important;}
    .wizard-top h1,.wizard-top h2 { font-size:16px; }
    .wizard-top h2 { max-width:175px; }
    //.our-policy { background-image: url(../images/our-policy-mobile-bg.png); background-size: contain; padding-bottom: 60%;}
	.our-policy {
	    background-image: url(../images/our-policy-mobile-bg.png); /* �f�t�H���g: PNG */
	    background-size: contain;
	    padding-bottom: 60%;
	}

	@supports (background-image: url(../images/our-policy-mobile-bg.webp)) {
	    .our-policy {
	        background-image: url(../images/our-policy-mobile-bg.webp); /* WebP ��D�� */
	    }
	}

	.about {
	    background-image: url(../images/about-mobile-bg.png); /* �f�t�H���g: PNG */
	    height: 1300px !important;
	    background-size: cover;
	}

	@supports (background-image: url(../images/about-mobile-bg.webp)) {
	    .about {
	        background-image: url(../images/about-mobile-bg.webp); /* WebP ��D�� */
	    }
	}

    .message {
	    background-image: url(../images/message-mobile-bg.png); /* �f�t�H���g: PNG */
	    background-size: contain;
	    padding-top: 40%;
	}

	@supports (background-image: url(../images/message-mobile-bg.webp)) {
	    .message {
	        background-image: url(../images/message-mobile-bg.webp); /* WebP ��D�� */
	    }
	}
    .official-site-mobile{ display: block; padding: 10px 0 30px; float: left; width: 100%; display: block;}
    .official-site-mobile img{ width: 100%;}
    .mobile-call{ float: left; width: 100%; padding: 20px 0; display: block;}
    .mobile-call a{     padding:20px 15px 20px 40px; font-size: 12px; background-color: #75bb1a; color: #fff; width: 100%; max-width: 400px; border-radius: 50px; margin: auto; display: block; position: relative;}
	.mobile-call a::after {
	    left: 15px;
	    content: "";
	    background-image: url(../images/call-icon.png); /* �f�t�H���g: PNG */
	    display: block;
	    height: 20px;
	    width: 20px;
	    background-size: 18px;
	    background-repeat: no-repeat;
	}

	@supports (background-image: url(../images/call-icon.webp)) {
	    .mobile-call a::after {
	        background-image: url(../images/call-icon.webp); /* WebP ��D�� */
	    }
	}
    .mobile-call a::before{ right: 20px; content: "\f054";}
    .mobile-call a::before, .mobile-call a::after{position: absolute;  font-family: "Font Awesome 5 Free"; font-weight: 600; top: 50%; margin-top: -9px; }
    .wizard-body button.nextBtn{ height: 50px;}
    #pc_about_us{display: none;}
    #sp_about_us{display: block;}
    #email{width: 100%;}
    #pc_reason{display: none;}
    #sp_reason{display: block;}
    .our-policy-inner h2 {font-size: 35px;}
    .about-inner h1 {font-size: 35px;}
    #pc_contact_title{display: none;}
    #sp_contact_title{display: block;}
    .step2_consult{width: 100%;}
    .step2_consult1{width: 100%;}
    .step2_consult2{width: 100%;}
    .step2_consult3{width: 100%;}
    .sp_mode{width: 90% !important; margin-left: 5%;}
    .detail_content{width: 90%;margin-left: 5%;}
    .thanks_pb{padding-bottom: 50px;}
    /*#pc_step3_last{display: none;}
    #sp_step3_last{display: block;}*/
}
@media(min-width:641px) and (max-width:767px)
{
    .message{ background-size: cover;}

}
@media(min-width:576px) and (max-width:767px)
{
    .reason-bottom .row{ margin-left: -5px; margin-right: -5px;}
    .reason-bottom .col-sm-4, .reason-bottom .col-sm-6{ padding: 0 5px;}
}

@media(max-width:575px)
{
    .header-top ul.navbar-nav li a { font-size: 10px;}
    .header-logo .header-logo-title h1 { font-size: 16px; }
    .header-logo .header-logo-title h1::after, .header-logo .header-logo-title h1::before { width: 15%; }
    
    .reason-inner-block-top div h2 { font-size: 24px; line-height: 36px; }
    .reason-inner-block { padding: 15px;}
    .reason-bottom p { min-height: auto; padding-bottom: 20px; }
    .reason-inner-block-top div h2 { font-size: 17px;} 
    .slider-wrapper button.slick-prev.slick-arrow:before, .slider-wrapper button.slick-next.slick-arrow:after{ height: 60px; line-height: 60px; margin-top: -30px;}
    .about{ height: 1200px !important;}
    .message{ padding-top:30%;}
}

@media(max-width:480px)
{
    .header-bottom-inner h1{ padding:0; font-size: 24px; line-height: 36px; }
    .message-inner{ margin-top: 60px;}

    .header-top a.navbar-brand img { max-width: 120px; }
    .collapse:not(.show){ left: 125px;}
    .header-tell-wrapper { top: 30px;}
    .header-bottom-inner h4{max-width: 180px; line-height: 28px; font-size: 28px;}
    .header-bottom-inner h4 span {font-size: 16px;}
    .header-bottom-inner h5 { font-size: 16px; max-width: 330px;}
    .header-bottom-inner h6 { font-size: 16px; max-width: 250px;}
    .header-logo .header-logo-title h1 { font-size: 14px; }
    .header-logo .header-logo-title h1::after, .header-logo .header-logo-title h1::before{ width: 0;}
    .wizard-inner { padding: 30px 0; }
    .stepwizard-step p{ font-size: 16px;}
    .contact-title h1 { font-size: 24px; line-height: 36px; }
    .contact-title a, .message-inner a { padding: 20px 15px; font-size: 12px; }
    .contact-title a::after, .message-inner a::after{ margin-top: -9px;}
    .contact-title { margin-bottom: 20px; }
    .slider-wrapper button.slick-prev.slick-arrow:before, .slider-wrapper button.slick-next.slick-arrow:after{ height: 50px; line-height: 50px; margin-top: -25px; width: 30px;}
    .message-inner { margin-top: 40px; padding:20px 10px;}
    .message-inner h1 { font-size: 35px; line-height: 42px; }
    .message{ height: auto;}
    footer { padding: 20px 5px;}
    .about{ height: 1200px !important;}
    .message{ padding-top: 40%;}
}

@media(max-width:400px)
{
    .about{ height: 1300px !important;}
}

.has-error{
    border-color: red;
    box-shadow: 0 0 0 0.2rem rgba(255,0,0,.25);
}
