﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDGothic&family=BIZ+UDPGothic&family=BIZ+UDPMincho&display=swap');
@charset "UTF-8";

/* ==================================================
 Variables
================================================== */

:root{
    --colorSchemeBase: #236176; /*#008000*/;
    --colorSchemeLightBase: #ebfaec;
    --colorSchemeAccent: #ff6600;
    --colorSchemeLightAccent: #fff0d2;
    --colorSchemeAttention: #cc0000;
    --colorSchemeBright: #ffffff;
    --colorSchemeDarkGray: #666666;
    --colorSchemeGray: #cccccc;
    --colorSchemeLightGray: #f6f6f6;

    --colorSchemeLightAccent: rgba(255,255,200,1);
    --colorSchemeLightBlue: #fcfdff;
    --colorSchemeLink:#0000cc;

}

/* ==================================================
 Normalize
================================================== */

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,summary,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: top;
    -webkit-tap-highlight-color: #4d4d4d;
    color:#4d4d4d;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block;
}
ol,ul {
    list-style: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
sup {
    vertical-align: top;
}
a, .module-link {
    width: auto;
    color: inherit;
    text-decoration: underline;
    color:#024FA1;
    cursor: pointer;
}
wbr + span {
    white-space: nowrap;
}
img {
    /*width: 100%;*/
}
input,
textarea,
button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    vertical-align: middle;
    outline: none;
}
select {
  /*-webkit-appearance: none;
    appearance: none;*/
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    vertical-align: middle;
    outline: none;
}
select.center {
    text-align-last: center;
    text-align: -webkit-center;
}
input[type="text"],
input[type="search"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="date"],
input[type="number"],
select {
    width: 100%;
    min-height: 45px;
    padding: 0 10px .15em;
    background-color: #fff ;
    background-repeat: no-repeat;
    border: 1px solid #008000;
    border-radius: 5px;
}

input[type="text"],
textarea
{
    font-size:16px;
}

textarea {
    width: 100%;
    min-height: 8em;
    padding: 10px .15em 10px .15em;
    background-color: #fff;
    background-repeat: no-repeat;
    border: 1px solid #008000; 
    border-radius: 5px;
}
textarea:focus {
    border: 1px solid #008000;
}
textarea:placeholder{
    color: #A9A292; 
}
textarea:focus::placeholder{
    color: #fff; 
}
textarea:-ms-input-placeholder {
    color: #A9A292;
}

input[type="text"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="number"]:focus{
    padding-right: 8px;
    padding-left: 8px;
    background-color: #fff;
    border: 1px solid #008000;
}

html {}
body {
    position: relative;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-family: "BIZ UDPGothic","Noto Sans JP", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro, Osaka, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overscroll-behavior-y: none;
    overscroll-behavior: none;
}
*, *:before, *:after {
    box-sizing: border-box;
}


/* Button
------------------------------ */
.button-box{
    display:inline-block;
    margin:0px 10px 0px 10px;
    padding: 7px 10px  7px 10px;
    border:0px solid #4d4d4d;
    border-radius: 100vh;
    color:#fff;
    background-color:#008000 ;
    font-size:15px;
    font-weight:800;
    cursor:pointer;
    text-align:center;
    overflow:hidden;
    border:1px solid #008000; 
    width:180px;
}
.button-box.light{
    border:1px solid #008000; 
    background-color:#fff;
    color:#008000;
}
.button-box.red{
    border:1px solid #cc0000; 
    background-color:#cc0000;
    color:#ffffff;
}
.button-box.disabled{
    border:1px solid #A9A292; 
    background-color:#A9A292;
    color:#fff;
    cursor:initial;
}

.button-box:focus      
{
    border:1px solid #ebfaec;
}
.hyperlink{
    display:inline-block;
    margin:0px 10px 0px 10px;
    padding: 7px 10px  7px 10px;
    border:0px solid rgba(255,255,255,0);
    background-color:rgba(255,255,255,0);
    cursor:pointer;
    color:#0000aa;
    text-decoration:underline;
 } 
.hyperlink:focus{
    border:1px dashed #024FA1;
 } 


.button-box-collection            {display:flex        ;margin:30px 30px 30px 30px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;justify-content:space-around;align-items:center;}
.button-box-collection.horizontal {flex-direction:column}
.button-box-collection>.cancel    {display:inline-block;margin:10px  0px  0px  0px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;color:#0000aa;text-decoration:underline;cursor:pointer;}

.button-box-single                        {display:flex        ;margin:20px 30px 20px 30px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;justify-content:center;align-items:center;flex-direction:column;text-align:center}
.button-box-single>.button-box            {                     max-width:250px;width:180px;}
.button-box-single>.hyperlink             {                     margin:10px  0px  0px  0px;padding: 0px  0px  0px  0px;font-size:12px;font-weight:300;}

/* Radio */
.radio-collection                                               {display:flex        ;margin: 0px  0px 25px  0px;padding: 2px 10px  2px 10px;border:0px solid #0000ff;width:100%;justify-content:center;}
.radio-collection>label                                         {display:flex        ;margin: 7px  0px  7px  0px;padding: 5px 10px  5px 10px;border:0px solid #008000;min-width:180px;background-color:#ffffff;justify-content:center;align-items:center; border-radius:100vh;cursor:pointer;transition:500ms;transition-property:background-color,color;font-size:15px;font-weight:800}
.radio-collection>.buffer                                       {display:block       ;margin: 0px  0px  0px  0px;padding: 0px  0px  0px  0px;border:0px solid #008000;min-width:40px;}
.radio-collection>input[type="radio"   ]                        {display:none;}
.radio-collection>input[type="radio"   ]:not(:checked)+ label   {background-color:#fff    !important;}
.radio-collection>input[type="radio"   ]:checked      + label   {background-color:#4d4d4d !important;color:#fff;}


/*Body*/

body                                     {background-color:#ffffff;}

.top-bar-back                                    {                  display:block       ;margin: 0px  0px  0px  0px;padding: 0px  0px  0px  0px;border:0px solid #ff00ff;            height:130px;}
.top-bar                                         {position:fixed   ;display:block       ;margin: 0px  0px  0px  0px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;width: 100%;height:80px;top:0px;left:0px;align-items:center;background-color:#ffffff;}
.top-bar>.company-block                          {                  display:flex        ;margin: 0px  0px  0px  0px;padding:10px  0px 10px  0px;border:0px solid #d000ff;width: 100%;                             align-items:center;justify-content:center;}
.top-bar>.company-block>.company-icon            {                  display:block       ;margin: 0px 10px  0px 20px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;width: 40px;height:40px;}
.top-bar>.company-block>.company-name            {                  display:block       ;margin: 0px 20px  0px  0px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;width:300px;            font-size:32px;color:#236176}
.top-bar>.menu-list                              {                  display:flex        ;margin: 0px  0px  0px  0px;padding:10px  0px 10px  0px;border:0px solid #ff0000;width: 100%;                           background-color:#236176; align-items:center;justify-content:center;}
.top-bar>.menu-list>li                           {                  display:block       ;margin: 0px 10px  0px 10px;padding: 0px  0px  0px  0px;border:0px solid #0000ff; }
.top-bar>.menu-list>li>a                         {                  display:inline-block;margin: 0px  0px  0px  0px;padding: 0px  0px  0px  0px;border:0px solid #0000ff;                        font-size:18px;color:#fff}



/* Modal
------------------------------ */

.module-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.module-modal.is-visible {
    display: block;
}
.module-modal .modal-inner-1 {
    width: 100%;
    height: 100%;
    overflow: auto;
}
.module-modal .modal-inner-2 {
    position: relative;
    width: 100%;
    max-width: 560px;
    margin: 10px auto;
}

.module-modal .modal-content {
    width: 560px;
    padding: 20px 20px;
    background-color: #fff;
    border-radius: 10px;
}
.module-modal .modal-content .modal-image{
	object-fit: contain;
	width :100%;
}
.module-modal .modal-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
}
.module-modal .modal-title {
    color: #4d4d4d; 
    font-size: 22px;
    font-weight: 800;
    text-align:center;
}
.module-modal .modal-title + * {
    
}
.module-modal .modal-note {
    margin-top: 20px;
    font-size: 15px;
}
.module-modal .modal-button {
    display: flex;
    margin-top: 40px;
}
.module-modal .modal-button li {
    flex-grow: 1;
    flex-basis: 0;
    margin-left: 20px;
}
.module-modal .modal-button li:first-child {
    margin-left: 0;
}

.modal-inner-mobilebar{
    display:none;
}
.modal-inner-mobilebar-buffer{
    display:none;
}

.body-onmodal{
    overflow-y:hidden;
}

@media screen and (max-width: 575px) {

    .module-modal {
        
    }
    .module-modal .modal-inner-2 {
        max-width: 575px;
        margin: 0px auto;
        padding:0px;
        border-radius:0;
    }
    .module-modal .modal-content {
        width: 100%;
        padding: 25px 0px 30px 0px;
        border-radius:0;
    }
    .module-modal .modal-title {
        margin-bottom: 0px;
        font-size: 15px;
    }
    .module-modal .modal-title + * {
        margin-top: 0px;
    }
    .module-modal .modal-note {
        margin-top: 20px;
        font-size: 15px;
    }
    .module-modal .modal-button {
        margin-top: 30px;
    }
    .module-modal .modal-button li {
        margin-left: 15px;
    }
    .module-modal .modal-button li:first-child {
        margin-left: 0;
    }

    .module-modal .modal-inner-mobilebar{
        position:absolute;
        display:flex;
        margin: 0px  0px  0px  0px;
        padding: 0px  0px  0px  0px;
        border-bottom:1px solid #cacaca;
        width:100vw;
      /*width:calc(100vw - 12px );*/
        height:35px;
        top:0px;
        background-color:#cfcfcf;
        justify-content:space-between;
    }
    .module-modal .modal-inner-mobilebar>.command{
        display:flex;
        margin: 0px  0px  0px  0px;
        padding: 2px 10px  2px 10px;
        border:0px solid #cccccc;
        justify-content:center;
        align-items:center;
        overflow:hidden;
        min-width:120px;
        font-size:15px;    
        cursor:pointer;
    }
    .modal-inner-mobilebar>.command:first-child{
        border-right:1px solid #999;
    }
    .modal-inner-mobilebar>.command:last-child{
        border-left:1px solid #999;
    }
    .modal-inner-mobilebar-buffer{
        display:block;
        height:30px;
    }
}

.module-modal.layer1 {
    z-index: 990;
}
.module-modal.layer1 .modal-inner-2 {
    z-index: 992;
    padding:0px !important;
}
.module-modal.layer1 .modal-bg {
    z-index: 991;
}
.module-modal.layer1>.modal-inner-1>.modal-inner-mobilebar
{
    z-index:994;
}



.module-modal.layer2 {
    z-index: 980;
}
.module-modal.layer2 .modal-inner-2 {
    z-index: 982;
}
.module-modal.layer2 .modal-bg {
    z-index: 981;
}
.module-modal.layer2>.modal-inner-1>.modal-inner-mobilebar
{
    z-index:984;
}


.module-modal.layer3 {
    z-index: 970;
}
.module-modal.layer3 .modal-inner-2 {
    z-index: 972;
}
.module-modal.layer3 .modal-inner-2>.modal-content-back{
    z-index: 973;
}
.module-modal.layer3 .modal-bg {
    z-index: 971;
}
.module-modal.layer3 .modal-inner-mobilebar
{
    z-index:974;
}





