@charset "UTF-8";

   label{
        display: block;
    }
    label.select input {
        position: absolute;
        top: 50%;
        left: 5px;
        margin-top: -8px;
    }
    select {
        display: inline-block;
        width: 96%;
        margin: 5px;
        padding: 3px 0;
        font-size: 13px;
    }
    #formstep {
        text-align: center;
        margin: 20px 0;
    }
    #formstep ul {
        width: 600px;
        margin: 0 auto;
    }
    #formstep ul li {
        width: 150px;
        float: left;
        position: relative;
    }
    #formstep ul li p span.num {
        display: block;
        width: 50px;
        height: 50px;
        line-height: 50px;
        margin: 0 auto;
        background-color: #dcdcdc;
        border-radius: 100px;
    }
    #formstep ul li p span.nex {
        position: absolute;
        top: 15px;
        right: 0;
        font-size: 140%;
        font-weight: bold;
        color: #999;
    }
    #formstep ul li p span.num.active {
        background-color: #187fcc;
        color: #fff;
        font-weight: bold;
    }
    .hide_onload {
        display:none;
    }
    label img {
        border: solid 3px #ffffff;
        cursor: pointer;
    }
    label img:hover {
        border: solid 3px #ffff00;
        opacity: 0.7;
    }
    .smallTextBlock {
        font-weight: normal;
        font-size: 85%;
    }
    .col{
        display: inline-block;
    }
    .col.right {
        float: right;
        margin-left: 3.2258064515%;
    }
    .one-second {
        width: 48.3870967741%;
    }
    .one-third {
        width: 31.1827956988%;
    }
    .two-third {
        width: 65.5913978494%;
    }
    .posCenter { margin: 0 auto; }
    .alignCenter { text-align: center; }
    .inlineBlock { display:inline-block; }
    label.select { cursor: pointer; }
    label.select:hover { filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7; }
    .colorR { color:red; }
    .bold { font-weight:bold; }
    .fontB10 { font-size:110%; }
    .fontB20 { font-size:120%; }
    .underline{ text-decoration:underline; }
    .mt5 { margin-top: 5px; }
    .mt10 { margin-top:10px; }
    .mt15 { margin-top:15px; }
    .mt20 { margin-top: 20px; }
    .mr5 { margin-right: 5px; }
    .mr10 { margin-right:10px; }
    .mr15 { margin-right:15px; }
    .mr20 { margin-right: 20px; }
    .mb5 { margin-bottom: 5px; }
    .mb10 { margin-bottom:10px; }
    .mb15 { margin-bottom:15px; }
    .mb20 { margin-bottom: 20px; }
    .ml5 { margin-left: 5px; }
    .ml10 { margin-left:10px; }
    .ml15 { margin-left:15px; }
    .ml20 { margin-left: 20px; }
    .ml40 { margin-left: 40px; }
    .ml50 { margin-left: 50px; }
    .mtb5 { margin: 5px 0; }
    .mtb10 { margin: 10px 0; }
    .mtb15 { margin: 15px 0; }
    .mtb20 { margin: 20px 0; }
    .mrl5 { margin: 0 5px; } 
    .mrl10 { margin: 0 10px; }
    .mrl15 { margin: 0 15px; }
    .mrl20 { margin: 0 20px; }
    .pt5 { padding-top: 5px; }
    .pt10 { padding-top:10px; }
    .pt15 { padding-top:15px; }
    .pt20 { padding-top: 20px; }
    .pr5 { padding-right: 5px; }
    .pr10 { padding-right:10px; }
    .pr15 { padding-right:15px; }
    .pr20 { padding-right: 20px; }
    .pb5 { padding-bottom: 5px; }
    .pb10 { padding-bottom:10px; }
    .pb15 { padding-bottom:15px; }
    .pb20 { padding-bottom: 20px; }
    .pl5 { padding-left: 5px; }
    .pl10 { padding-left:10px; }
    .pl15 { padding-left:15px; }
    .pl20 { padding-left: 20px; }
    .pl30 { padding-left: 30px; }
    .pl40 { padding-left: 40px; }
    .pl50 { padding-left: 50px; }
    .ptb5 { padding: 5px 0; }
    .ptb10 { padding: 10px 0; }
    .ptb15 { padding: 15px 0; }
    .ptb20 { padding: 20px 0; }
    .prl5 { padding: 0 5px; }
    .prl10 { padding: 0 10px; }
    .prl15 { padding: 0 15px; }
    .prl20 { padding: 0 20px; }
    .formButton {
        padding: 6px;
    }
    .formButton input[type=radio],
    .formButton input[type=checkbox] {
        display: inline-block;
        margin-right: 6px;
    }
    .formButton input[type=radio] + label,
    .formButton input[type=checkbox] + label {
        position: relative;
        display: inline-block;
        margin-right: 12px;
        font-size: 14px;
        line-height: 30px;
        cursor: pointer;
    }
    .mail-order{ margin: 0px; }
    .alignRight{ margin: 10px 0 10px; }
    .required + .input-box.error::before{ color:#fff; }
	.row { margin-right: 0px!important; margin-left: 0px!important;}
	
    @media (min-width: 1px) {
        .formButton input[type=radio],
        .formButton input[type=checkbox] {
            display: none;
            margin: 0;
        }
        .formButton input[type=radio] + label,
        .formButton input[type=checkbox] + label {
            padding: 0 0 0 35px;
        }
        .formButton input[type=radio] + label::before,
        .formButton input[type=checkbox] + label::before {
            content: "";
            position: absolute;
            top: 40%;
            left: 0;
            
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            display: block;
            width: 25px;
            height: 25px;
            margin-top: -9px;
            
            background: #FFF;
        }
        .formButton input[type=radio] + label::before {
            border: 2px solid #ccc;
            border-radius: 30px;
        }
        .formButton input[type=checkbox] + label::before {
            border: 2px solid #ccc;
        }
        .formButton input[type=radio]:checked + label::after,
        .formButton input[type=checkbox]:checked + label::after {
            content: "";
            position: absolute;
            top: 40%;
            
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            display: block;
        }
        .formButton input[type=radio]:checked + label::after {
            left: 5px;
            
            width: 15px;
            height: 15px;
            margin-top: -4px;
            
            background: #009cff;
            border-radius: 8px;
        }
        .formButton input[type=checkbox]:checked + label::after {
            left: 3px;
            width: 30px;
            height: 15px;
            margin-top: -13px;
            border-left: 3px solid #009cff;
            border-bottom: 3px solid #009cff;
            
            -webkit-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            transform: rotate(-45deg);
        }
    }
    @media screen and (max-width: 720px) {
        #formstep ul,.row80{ width: 100%; }
        #formstep ul li{ width: 20%; margin: 0 2% 0; font-size: 10px; }
        #formstep ul li p span.nex{ font-size: 80%; right: -10px; }

        .formBoxTitle{ font-size: 20px; margin: 20px 10px; }
        .sub-content{ font-size: 16px; margin: 20px 10px; }
        .btn-grey{ margin: 0 0 10px; }
        .liststyle,.fontB20 { font-size: 100%; }
        .mail-order{ padding: 10px; }
        .form-box{ border-top: 1px solid #ccc; margin: 10px 0 0; padding: 10px 0 0; }
        .form-box .label-box{ width: 100%!important; display: block; font-weight: bold; color:#187fcc; }
        .form-box .label-box.required:before{ right: 0px; left: auto; }
        .form-box .placeholder{ font-size: 11px; display: block; }
        h1.title{ font-weight: bold; margin: 0 0 10px; }
        .area-button{ margin: 20px 0 0; }
        .search_style1 select{ margin: 0 2% 0 0; }
        .search_style1 input{ margin: 0px; border:none; }
    }

    .kaitori_form{ margin: 0px 0 20px !important; }
    @media screen and (max-width:600px){
        .kaitori_form{
            margin: 30px 0 20px !important;
        }
    }
    .h1_kaitori_form{ font-size: 30px; }
    @media screen and (max-width:600px){
        .h1_kaitori_form{
            margin: 10px;
            font-weight: 700;
            color:#434343;
        }
    }
    @media screen and (max-width:600px){
        #formstep ul li{
            width: 20.5%;
        }
    }
    #formstep ul li p{
        font-size: 10px;
    }
    @media screen and (max-width:600px){
        #formstep ul li p span.nex{
            top: 17px;
            right: -20px;
            font-size: 51%;
            width: 28px;
        }
    }
    .formBoxTitle {
    color: #222222;
    border-left: 15px solid #187fcc;
    border-bottom: 3px solid #187fcc;
    font-size: 20px;
    margin: 5px 0 30px 0;
    padding: 5px 0 5px 20px;
    font-size: 28px;
    font-weight: bold;
    }
    @media screen and (max-width:600px){
        .formBoxTitle {
            font-size: 20px !important;
            margin: 20px 10px;
        }
    }
    .sub-content{
    font-size: 16px;
    margin: 20px 10px;
    font-weight: bold;
    }
    @media screen and (max-width:600px){
        .sub-content{
            margin: 20px 10px;
        }
    }
    label.select {
        position: relative;
        display: block;
        margin: 5px;
        padding: 5px 5px 5px 40px;
        background: #fff;
        background-image:    -webkit-gradient(linear, left top, left bottom, from( #fff), to( #eee)); /* Saf4+, Chrome */
        background-image:    -webkit-linear-gradient( #fff, #eee); /* Chrome 10+, Saf5.1+ */
        background-image:       -moz-linear-gradient( #fff, #eee); /* FF3.6 */
        background-image:        -ms-linear-gradient( #fff, #eee); /* IE10 */
        background-image:         -o-linear-gradient( #fff, #eee); /* Opera 11.10+ */
        background-image:         linear-gradient( #fff, #eee);
        border: 1px solid #ccc;
        border-radius: 5px;
        font-size: 14px;
        font-weight: bold;
    }
    @media screen and (max-width:600px){
        label.select {
            width: 100%;
        }
    }

    .formButton input[type=radio] + label,
    .formButton input[type=checkbox] + label {
        font-size: 14px;
        line-height: 30px;
        cursor: pointer;
    }
    @media screen and (min-width: 1px) {
    .formButton input[type=radio],
    .formButton input[type=checkbox] {
        display: none;
        margin: 0;
    }
    .formButton input[type=radio] + label,
    .formButton input[type=checkbox] + label {
        padding: 0 0 0 25px;
    }
    .formButton input[type=radio] + label::before,
    .formButton input[type=checkbox] + label::before {
        content: "";
        position: absolute;
        top: 40%;
        left: -19px;
        
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
        width: 25px;
        height: 25px;
        margin-top: -9px;
        
        background: #FFF;
    }
    .formButton input[type=radio] + label::before {
        border: 2px solid #ccc;
        border-radius: 30px;
    }
    .formButton input[type=checkbox] + label::before {
        border: 2px solid #ccc;
    }
    .formButton input[type=radio]:checked + label::after,
    .formButton input[type=checkbox]:checked + label::after {
        content: "";
        position: absolute;
        top: 40%;
        
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
    }
    .formButton input[type=radio]:checked + label::after {
        left: -14px;
        
        width: 15px;
        height: 15px;
        margin-top: -4px;
        
        background: #009cff;
        border-radius: 8px;
    }
    .formButton input[type=checkbox]:checked + label::after {
        left: -13px;
        width: 30px;
        height: 15px;
        margin-top: -13px;
        border-left: 3px solid #009cff;
        border-bottom: 3px solid #009cff;
        
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    }

    label.select label{
    margin: 5px;
    }

    .row80{
        width: 80%;
    }
    @media screen and (max-width:600px){
        .row80{
            width: 100%;
        }
    }

    .setsumei{
    margin-bottom: 10px;
    line-height: 1.7;
    margin: 0;
    padding: 15px;
    font-size:16px;
    font-weight: normal;
    background-color: #f6f8ff;
    }

    .liststyle{
        list-style-type:disc;
        margin-left:50px;
        font-size:16px;
        font-weight: normal;
    }
    @media screen and (max-width:600px){
       .liststyle{
            margin-left:0px;
            font-size:16px;
       }
    }

    .fontB20{
    font-size:16px;
    font-weight: normal;
    }
    @media screen and (max-width:600px){
        .fontB20{
            font-size:16px;
        }
    }

    .kaitori_form_textarea{
        width:570px;
        margin:0 auto;
        display:block;
        padding:10px;
        margin-bottom:20px;
        font-size:115%;
        border: 1px solid #CCc !important;
        font-weight: normal;
        font-size:15px;
    }
    @media screen and (max-width:600px){
        .kaitori_form_textarea{
            width:100%;
        }
    }
    /* 小見出し */
    .titleMini {
        color: #fff;
        background-color: #187fcc;
        font-size: 18px;
        margin: 40px 0 8px 0;
        padding: 7px 6px;
    }
    @media screen and (max-width:600px){
        .titleMini {
            font-size:16px;
        }
    }
    .btn-grey, .btn-green{
        border-radius: 3px !important;
        width: 70% !important;
        margin: 0 auto !important;
        margin-top: 10px !important;
        font-size: 22px !important;
        padding: 11px;
        color: #ffffff;
        font-weight: bold;
        background: #3cc464;
        border:2px solid #3cc464 !important;
        font-weight: bold !important;
        box-shadow: 0 3px #2b8c49;
    }
    @media screen and (max-width:600px){
        .btn-grey, .btn-green{
            font-size: 16px !important;
            width: 100% !important;
        }
    }
    .btn-grey{
    font-size: 16px !important;
    display: block !important;
    width: 40% !important;
    background: #dddddd !important;
    color: #363535 !important;
    }
    .btn-grey:hover{
    background: rgb(236, 236, 236) !important;
    transition-duration: 0,3s !important;
    color: #363535 !important;
    }
    .btn-green:hover{
    background: #fff!important;
    transition-duration: 0,3s !important;
    color: #3cc464 !important;
    border:2px solid #3cc464;
    }