/*-------------------------------------------------

-------------------------------------------------*/
html,body {
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-family: 'Noto Sans JP', sans-serif;
    color: #1a202c;
    font-size:20px;
}

*{ padding: 0; margin: 0;}

img{ border: none;}

.topimg{

}

.page h1{
    color: #1a202c;
    font-weight:bold;
    border-bottom: 3px solid #006AB6;
    padding:10px 0;
    margin:10px 0 0 0;
}

.page h2{ 
    border-left: 8px solid #006AB6;
    font-weight: bold;
    padding: 5px 15px;
    margin-top:70px;
}

.page h3{
    border-bottom: 1px solid  #006AB6;
    font-weight: bold;
    padding: 10px;
    margin-top:30px;
}

.page ol li{
    display: list-item;
    margin-left:20px;
    margin-bottom:15px;
}

h3{ font-size: 18px; color: #333333; font-weight: bold; line-height: 22px;}
h3 span{ font-size: 16px; color: #333333; font-weight:normal; line-height: 20px;}
a{ text-decoration:none; color: #006AB6;}
a:hover{ color: #6aaee0;}

h4{
    font-size: 16px;
    font-weight: bold; 
    width:360px;
    padding: 5px 0px;
    background-color: #251961;
    border-radius: 20px;
    text-align: center;
    color: #ffffff;
    margin:10px 0px;
}

.kaisai_wrap{
    width:100%;
    display: flex;
    flex-wrap: wrap;
}

.kaisai_block{
    background:#006AB6;
    color:#ffffff;
    text-align: center;
    width: 140px;
    padding:5px 0;
    margin-top:60px;
    margin-right:15px;
}

.enjya_box{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.enjya_box .left{
    width:180px;
}

.enjya_box .left img {
    width: 100%;
}

.enjya_box .right{
    width: calc(100%-180px);
    padding-left:30px;
}

.red{
    color:#cc3366;
    font-weight: bold;
}

.blue{
    color :#006AB6;
    font-weight: bold;
}

.white{
    color :#fff;
    font-weight: bold;
}

.red_box{
    color:#cc3366;
    border:2px solid #cc3366;
    padding:20px;
}

.hissu{
    background-color: #fff;
    border:1px solid #ff0000;
    color:#ff0000;
    font-size:11px;
    padding:1px 5px;
    font-weight: normal;
    margin-right:4px;
}

.margin_s{margin-top:10px !important;}
.margin_m{margin-top:30px !important;}
.margin_l{margin-top:50px !important;}
.margin_m_b{margin-bottom:60px !important}
.margin_l_b{margin-bottom:90px !important}

.submessage{
    list-style: none;
    display: flex;
    justify-content: space-around;
}

.submessage li{
    text-align: center;
    background-color:#006AB6;
    width:30%;
    padding:10px 0;
    border-radius: 5px;
}

/*-------------------------------------------------
GENERAL CLASSES
-------------------------------------------------*/
.page{ width: 960px; margin:0 auto;}

.gaiyou ul{margin-top:40px;}
.gaiyou li{display: flex; margin-bottom:3px;}
.gaiyou li p:first-child{font-weight:bold; width:20%; background-color: #ccc; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:10px; box-sizing: border-box;}
.gaiyou li p:last-child{width:80%; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:20px; box-sizing: border-box;}
.gaiyou .p_submit{background-color: #fff !important; text-align: center;}

.syoseki{width:960px;}
.syoseki ul{display: flex; list-style: none; justify-content:space-around;}
.syoseki li{}
.syoseki img{width:200px;}

.mailform ul{margin-top:40px;}
.mailform li{display: flex; margin-bottom:3px;}
.mailform li p:first-child{font-weight:bold; width:30%; background-color: #ccc; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:10px; box-sizing: border-box;}
.mailform li p:last-child{width:70%; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:20px; width: 100%; box-sizing: border-box;}
.mailform .p_submit{background-color: #fff !important; text-align: center;}

.center{text-align:center; margin:0 auto;}


.text_right{text-align:right;}

.font_b{font-weight:bold;}

.text_s{font-size:0.9rem;}
.text_m{font-size:1.2rem;}
.text_l{font-size:1.4rem;}

.head_line{
    overflow: hidden;
    margin: 0 auto;
    min-width: 960px;
}

.head_wrap {
    background: #006AB6;
    overflow: hidden;
    padding: 2px;
}

.head_wrap .panel {
    width: 960px;
    margin: 0 auto;
    background: none;
}

.head_wrap .panel p a {
    color: #ffffff;
    text-align: left;
}

.top_link{
    margin-top:10px;
    text-align: right;
}

.no_dt{
    display: none;
}

#page_top{
    width: 50px;
    height: 50px;
    position: fixed;
    right: 15px;
    bottom: 15px;
    background: #999;
    opacity: 0.6;
  }
  #page_top a{
    position: relative;
    display: block;
    width: 50px;
    height: 50px;
    text-decoration: none;
  }
  #page_top a::before{
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: '\f102';
    font-size: 25px;
    color: #fff;
    position: absolute;
    width: 25px;
    height: 25px;
    top: -5px;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
  }

/*-------------------------------------------------
MENU CLASSES
-------------------------------------------------*/
.menu-wrap{ overflow: hidden; background: #ffffff;}
.menu{ margin: 0 auto; width:960px; background: #ffffff;�@height:85px; margin-top:50px;}
.menu ul li{ list-style:none; float:left; width:auto;}
.menu ul li a{ display:block; height:85px; line-height:85px; padding-left:30px; padding-right:30px; font-size:18px; color:#1a202c; border-right:#ffffff solid 1px; text-transform:uppercase;}
.menu ul li a:hover{ background: #ffffff; color:#1a202c;}

.menu ul li a.M_01:hover{ background:#6aaee0; color:#ffffff;}
.menu ul li a.M_02:hover{ background:#ed7faf; color:#ffffff;}
.menu ul li a.M_03:hover{ background:#fbc92c; color:#ffffff;}
.menu ul li a.M_04:hover{ background:#10b3a0; color:#ffffff;}
.menu ul li a.M_05:hover{ background:#ece1e3; color:#1a202c;}

.menu ul li a.active{ background: #ece1e3; color:#1a202c;}

.menutext{
    padding-left: 1.4rem;
}

/*-------------------------------------------------
HEADER CLASSES
-------------------------------------------------*/
.header{margin:0 auto; width: 960px; position: relative;}
.logo{ width: 600px; float: left; line-height: 80px;}
.logo h1{ font-size:28px; color: #d13f31; font-weight: normal;}
.logo h1 span{ color:#1a202c;}

.social{ position: absolute; top: 10px; left: 0;}
.social ul li{list-style:none; float:left; margin-left:15px;}

/*-------------------------------------------------
div banner
-------------------------------------------------*/
.banner{width:850px; height:920px; margin:0 auto; margin-bottom:40px; background:url(images/body.jpg) no-repeat; position:relative;}
.banner h1{ padding:10px; float:right; background:#1a202c; text-transform:uppercase; color:#ffffff;  font-size:30px; font-weight:normal; position:absolute; top: 0px; right: 0;}
.banner h2{ padding:10px; float:right; background:#ffffff; text-transform:uppercase; color:#1a202c;  font-size:22px; font-weight:normal; font-family: Roboto; position: absolute; top: 58px; right: 0;}
.banner02{width:960px; margin:0 auto; margin-bottom:22px;}

.pdf_dl{font-weight: bold; text-align: center; box-sizing: border-box;}
.pdf_dl a{width:350px; padding:20px; margin:50px auto; border-radius: 10px; color:#ffffff; background-color :#006AB6; display: block;}
.pdf_dl a:hover {background-color:#6aaee0; display: block;}

.button_back{font-weight: bold; text-align: center; box-sizing: border-box;}
.button_back a{width:250px; padding:20px; margin:50px auto; border-radius: 10px; color:#ffffff; background-color :#006AB6; display: block;}
.button_back a:hover {background-color:#6aaee0; display: block;}

.page .bn{display: flex;}
.page .bn li{margin-right:30px;}

.button_flex{
    list-style: none;
    display: flex;
    justify-content:space-around;
}

.topix{
    border: 1px solid #a5daf3;
    background-color: #ceeefd;
    padding:25px;
}
/*-------------------------------------------------
MAIN COLUMAS CLASSES
-------------------------------------------------*/
.primary-col{ width: 960px; overflow: hidden;}
.primary-col p{ line-height: 35px;}
.generic{ overflow: hidden; width: 100%;}
.generic002{ overflow: hidden; width: 100%; background: #ffffff; margin: 30px 0 10px 0;}
.generic003{ overflow: hidden; width: 100%; background: #ffffff; margin: 20px 0 10px 0;}
.generic004{ overflow: hidden; width: 100%; background: #ffffff; margin: 20px 0 0px 0;}
.generic .panel{ padding: 20px 20px 30px 20px;}
.generic .title h1{ padding-bottom: 0px;}
.generic .content{ overflow: hidden;}
.block{ width: 320px;}
.block .panel{ padding: 10px 10px 30px 20px;}
.block .title h1{ padding-bottom: 0px;}
.block .content img{ padding-bottom: 20px;}
.block .content h3{ padding-bottom: 10px;}
.block .content p{ padding-bottom: 20px;}

.block .content dt{ font-size: 14px;}
.block .content dt.sec{ font-size: 14px; margin: 5px 0 0 0;}
.block .content dd{ font-size: 14px; line-height: 20px;}
.block .content dd.s12{ font-size: 12px; line-height: 20px;}
.block .content dd.s12 span{ padding: 0 0 0 12px;}

/*-------------------------------------------------
CONTACT FORM CLASSS
-------------------------------------------------*/

.contact-form { background:#f4f8f6; padding:30px; width:440px; float:left;}
.contact-form label {display: block; padding:10px 0 10px 0;}
.contact-form label span {display: block; color:#939191;font-size:14px; float:left; width:80px; text-align:left; padding:5px 20px 0 0;}
.contact-form .input_text {padding:10px 10px;width:318px;background:#ffffff;border:#e1ece7 1px solid; color:#939191;}
.contact-form .message{padding:10px 10px;width:318px; background:#ffffff; border:#e1ece7 1px solid;overflow:hidden;height:150px; color:#939191; font-size:14px;}
.contact-form .button{padding:8px;background:#1f7872; color:#ffffff; text-transform:uppercase; font-family:'Oswald', sans-serif;border:0px solid;margin-left:100px;margin-top:20px;}

.annotation{font-size:14px; line-height:24px !important;}


.address { float:left; width:370px; margin-left:30px;}
.address .panel { border:none; color:#9b9e9a}
.address .panel .title h1 {  color:#d13f31; padding-bottom:10px;}
.address .panel .content p span { color:#9b9e9a;}

table.type08 {
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    border-left: 1px solid  #999;
    margin: 0px 0px 20px 0px;
    font-size: 14px;
}

table.type08 thead th {
    padding: 12px;
    font-weight: bold;
    border-top: 1px solid #999;
    border-right: 1px solid #999;
    border-bottom: 1px solid  #999;
    background: #ccc;
    text-align: center;
}

table.type08 td {
    padding: 12px;
    vertical-align: top;
    border-right: 1px solid #999;
    border-bottom: 1px solid  #999;
    font-size: 14px;
}

.type08_2 {
    text-align: center;
}

input {
    font-size:16px;
    padding:4px;
    margin:5px 8px;
}

.form_width01{
    width:400px !important;
}

.form_width02{
    width:200px !important;
}

.form_width03{
    width:100px !important;
}

.textarea_width01{
    width:98% !important;
    height:200px !important;
}

.textarea_width02{
    width:98% !important;
    height:100px !important;
}

/*-------------------------------------------------
FOOTER CLASSES
-------------------------------------------------*/
footer{
    width:100%;
    height:80px;
    background-color:#006AB6 ;
    color:#fff;
    display: flex;
    align-items: center;
    justify-content: center;
}


/*-------------------------------------------------
SP
-------------------------------------------------*/

@media screen and (max-device-width: 759px) {

    html,body {
        font-size:40px;
        line-height: normal;
    }

    .margin_s{margin-top:1rem !important;}
    .margin_m{margin-top:3rem !important;}
    .margin_l{margin-top:4rem !important;}
    .margin_m_b{margin-bottom:4rem !important}
    .margin_l_b{margin-bottom:6rem !important}
    .margin_m_sp{margin-top:3rem !important;}

    .no_sp{
        display: none;
    }

    .no_dt{
        display: block;
    }

    .t_logo{
        text-align: center;
    }

    .t_logo img{
        width:28rem;
    }

    .page {
        width: 100%;
        margin: 0 auto;
    }

    .topimg{
        width:100%;
    }

    .wide{
        width:96%;
        margin:0 auto;
    }

    .page h1{
        border-bottom: 5px solid #006AB6;
        padding:0.5rem 0;
        margin:0.5rem 0 0 0;
    }
    
    .page h2{ 
        border-left: 8px solid #006AB6;
        font-weight: bold;
        padding: 5px 15px;
        margin-top:70px;
    }

    .page h3{
        padding-bottom: 1rem;
        margin-top:2rem;
    }

    .syoseki ul{display: block;}
    .syoseki li{margin-right:0; margin-bottom:6rem; text-align: center;}
    .syoseki img{width:20rem;}

    .page ol li{
        margin-left:3.5rem;
        margin-bottom:1rem;
    }

    .enjya_box {
        display: block;
    }

    .enjya_box .left {
        width: 100%;
        text-align: center;
    }

    .enjya_box .left img {
        width: 60%;
    }

    .enjya_box .right {
        width: 100%;
        padding-left: 0;
        text-align: center;
    }

    .full-width {
        width:100vw; 
        position: relative;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
    }

    .full-width img{
        max-width:100vw;
        width:100vw;
    }

    .gaiyou ul{margin-top:2rem;}
    .gaiyou li{display: block; margin-bottom:0.188rem;}
    .gaiyou li p:first-child{font-weight:bold; width:100%; background-color: #ccc; padding-top: 1rem; padding-bottom: 1rem; padding-left:1rem;}
    .gaiyou li p:last-child{width:100%; padding: 1rem 0 1rem 0.5rem;}


    .mailform ul{margin-top:3rem;}
    .mailform li{display: block; margin-bottom:0.2rem;}
    .mailform li p:first-child{font-weight:bold; width:100%; background-color: #ccc; padding-top: 1rem; padding-bottom: 1rem; padding-left:1rem;}
    .mailform li p:last-child{width:100%; padding: 1rem 0 1rem 0.5rem;}

    .head_wrap .panel {
        width: 100%;
        padding-left:1rem;
    }

    .kaisai_block {
        width: 10rem;
        padding: 0.5rem 0;
        margin-top: 1.2rem;
        margin-right: 15px;
        font-weight: bold;
    }

    .pdf_dl a {
        width: 70%;
        padding: 1rem;
        margin:2rem auto;
        border-radius: 0.3rem;
    }

    .button_back a{
        width: 70%;
        padding: 1rem;
        margin:2rem auto;
        border-radius: 0.3rem;
    }

    input {
        font-size:1rem;
        padding:0.3em;
        margin:1rem 0.5em;
    }

    .form_width01{
        width:20em !important;
    }

    .form_width02{
        width:10em !important;
    }

    .form_width03{
        width:5em !important;
    }

    .textarea_width01{
        width:98% !important;
        height:10rem !important;
    }
    
    .hissu {
        font-size:0.8rem;
        padding:0.1em 0.4em;
    }

    .red_box {
        padding: 1rem;
    }

    .button_flex{
        list-style: none;
        display: block;
    }

    .submessage{
        display: block;
    }

    .submessage li{
        margin:0 auto;
        width:70%;
        margin-bottom:1.2rem;  
    }

    #page_top{
        width: 4rem;
        height: 4rem;
    }

    #page_top a{
        width: 4rem;
        height: 4rem;
    }

    #page_top a::before{
        font-size: 1.5rem;
        width: 1.5rem;
        height: 1.5rem;
        top: -5px;
      }

    .text_s{font-size:1rem; line-height: normal;}
    .text_m{font-size:1.3rem; line-height: normal;}
    .text_l{font-size:1.5rem; line-height: normal;}

}