/*-------------------------------------------------

-------------------------------------------------*/
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:24px;
}

*{ padding: 0; margin: 0;}

img{ border: none;}

.wh_back{
    width:100%;
    background-color: #fff;
    box-sizing: border-box;
    padding:15px;
    box-sizing: border-box;
}

.ye_back{
    background-color: #fff;
    width:100%;
    padding:40px 0;
    box-sizing: border-box;
}

.or_back{
    background-color:#d8eefd;
    width:100%;
    padding:40px 0;
    box-sizing: border-box;
}

.mainlist li{
    margin-bottom:10px;
}

.item_m{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;
    width: 100px;
    padding: 10px;
    border-radius: 5px;
    color: #ffffff;
    background-color: #006AB6;
    display: block;
}

.caption{
    width:100%;
    border: 1px solid #cc3366;
    padding:1rem;
    box-sizing: border-box;
}

.caption2{
    margin:20px auto;
    width:600px;
    background-color: #006AB6;
    border :4px solid #fff;
    border-radius: 10px;
    padding:1rem;
    box-sizing: border-box;
}

.caption3{
    width:960px;
    margin:0 auto;
}

.caption4{
    border-radius: 10px;
    padding:0.5rem;
    background-color: rgb(236, 226, 129);
    width:100%;
    margin:0 auto;
    box-sizing: border-box;
}

section .wide{
    width:960px;
    margin:0 auto;
    box-sizing: border-box;
}

.toplogo{
    box-sizing: border-box;
    width:100%;
    background-size:cover;
    background-color: #fff;
    background-image: url("image/bg.png");
    background-repeat: no-repeat;
    background-position:right 0% top 30%;
}

.toplogo_bg{
    padding:30px;
    text-align: center;
    background: rgba(255, 255, 255, 0.1);
}

.page h1{
    font-size: 52px;
    color: #fff;
    font-weight:bold;
    line-height: 60px;
    letter-spacing: 0.1em;
    text-shadow: 1px 2px 3px #073b61;

}

.page .maintitle{
    color:#fff;
    font-size: 38px;
    font-weight: bold; 
    line-height: 1.8rem;
    letter-spacing: 0.1em;
}

.page .subtitle{
    width:100%;
    padding:15px;
    background-color: #006AB6;
    font-size: 20px;
    text-align: center;
    box-sizing: border-box;
}

.page h2{
    font-size: 1.4rem;
    font-weight: bold;
}

.page h3{ font-size: 18px; 
    font-weight: bold;
    padding: 5px;
    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;}

p{ line-height: 30px;}
a{ text-decoration:none; color: #1a202c;}
a:hover{ color:#006AB6;}

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;
}

.miryoku{
    width:500px;
    margin:0 auto;
}

.osusume li{
    list-style: none;
    margin-bottom:15px;
}

.enjya{
    margin:0 auto;
    padding:30px 0;
}

.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;
}

.subt_box{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.subt_box .left{
    width:90px;
}

.subt_box .right{
    width:300px;
}

.yotei{
    margin:0 auto;
    padding:30px 0;
}

.yotei_box{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.yotei_box .left{
    width:55%;
}

.yotei_box .right img {
    width: 100%;
}

.yotei_box .right{
    width: 45%;
    padding-left:20px;
}

.red{
    color:#e42b2b;
    font-weight: bold;
}

.blue{
    color:#006AB6;
    font-weight: bold;
}

.orange{
    color:#e78f0a;
}
.white{
    color:#fff;
}

.black{
    color:#1a202c;
    font-weight: bold;
}

.kogetya{
    color:#5c411c;
}

.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_ll{margin-top:80px !important;}
.margin_m_b{margin-bottom:60px !important}
.margin_l_b{margin-bottom:90px !important}

.line_s{line-height: 1.6rem;}

.subt_maru_blue{
    border-radius: 10px;
    padding:20px;
    text-align: center;
    background-color: #006AB6;
    margin-right:15px;
}

.kouen_box{
background-color: #d8eefd;
padding:20px;
}

#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;
  }

/*-------------------------------------------------
GENERAL CLASSES
-------------------------------------------------*/
.mar-top30{ margin-top: 30px;}
.mar-top20{ margin-top: 20px;}
.mar-top10{ margin-top: 10px;}
.mar-top-10{ margin-top: -10px;}

.mar-right30{ margin-right: 30px;}
.mar-bottom20{ margin-bottom: 20px;}

.mar-left200{ margin-left: 200px;}



.float-right{ float: right;}
.clearing { clear: both;}
.panel{ background: #ffffff;}
.title{}
.Stitle{ padding: 20px 20px 0px 20px;}
.content{}

.page{ width: 100%; margin:0 auto;}

.gaiyou{
    background-color: #fff;
    padding:40px;
    box-sizing: border-box;
}

.gaiyou ul{
    display:flex;
    flex-wrap: wrap;
}

.gaiyou li{
    display: flex;
    justify-content: center;
    align-items: center;
    width:100%;
    border-bottom :2px dotted #999;
}

.gaiyou li p:first-child{
    font-weight:bold;
    width:25%;
    padding:40px 0;
}
.gaiyou li p:last-child{
    width:75%;
    padding:20px 0;
}

.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{font-size:14px;}
.syoseki img{width:200px;}

.mailform ul{margin-top:40px;}
.mailform li{display: flex; font-size:20px; margin-bottom:3px;}
.mailform li p:first-child{font-weight:bold; width:30%; background-color:#006AB6; color:#fff; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:10px;}
.mailform li p:last-child{width:70%; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:20px; width: 100%;}
.mailform .p_submit{background-color: #fff !important; text-align: center;}

.program ul{margin-top:40px;}
.program li{display: flex; font-size:20px; margin-bottom:3px;}
.program li p:first-child{text-align: center; font-weight:bold; color:#fff; width:25%; background-color:#006AB6; padding-top: 15px; padding-bottom: 15px; line-height:normal; padding-left:10px; box-sizing: border-box;}
.program li p:last-child{width:75%; background-color:#fff; padding: 15px; line-height:normal; box-sizing: border-box;}
.program .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:17px; line-height: normal;}
.text_m{font-size:20px; line-height: normal;}
.text_mm{font-size:24px; line-height: normal;}
.text_l{font-size:36px; line-height: normal;}



.no_dt{
    display: none;
}

/*-------------------------------------------------
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;}

/*-------------------------------------------------
HEADER CLASSES
-------------------------------------------------*/
header{
    margin:0 auto;
    width: 100%;
    padding:20px 0 20px 20px;
    box-sizing: border-box;
}

header img{
    width: 250px;
}

.top_link{
    margin-top:10px;
    text-align: right;
}
/*-------------------------------------------------
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-size:20px; font-weight: bold; text-align: center; box-sizing: border-box;}
.pdf_dl a{width:350px; padding:20px; margin:50px auto; border-radius: 5px; color:#ffffff; background-color:#006AB6; display: block;}
.pdf_dl a:hover {background-color:#44B1FF; display: block;}


.button_flex{
    list-style: none;
    display: flex;
    justify-content:space-around;
}

.button_back{font-size:20px; font-weight: bold; text-align: center; box-sizing: border-box;}
.button_back a{width:250px; padding:20px; margin:50px auto; border-radius: 5px; color:#ffffff; background-color:#006AB6; display: block;}
.button_back a:hover {background-color:#44B1FF; display: block;}

.page .bn{display: flex;}
.page .bn li{margin-right:30px;}

.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:140px !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) {

    .mainlist{
        padding-left:3rem;
    }

    .mainlist li{
        margin-bottom:1.5rem;
    }
    

    html,body {
        font-size:18px;
    }

    .or_back,.ye_back,.wh_back {
        padding: 1.5rem 0;
    }

    section .wide{
        width: 100%;
    }

    .margin_s{margin-top:1rem !important;}
    .margin_m{margin-top:3rem !important;}
    .margin_l{margin-top:5rem !important;}
    .margin_l{margin-top:8rem !important;}
    .margin_m_b{margin-bottom:4rem !important}
    .margin_l_b{margin-bottom:8rem !important}
    .margin_m_sp{margin-top:3rem !important;}

    .toplogo {
        background-size: cover;
    }

    .no_sp{
        display: none;
    }

    .no_dt{
        display: block;
    }

    p {
        font-size:2.4rem;
        line-height: 3rem;
    }

    header{
        padding:1rem 0 1rem 1rem;
        box-sizing: border-box;
    }

    header img{
        width: 22rem;
    }

    .page {
        width: 100%;
        margin: 0 auto;
    }
    .syoseki{
        width:100%;  
    }
    .syoseki ul{
        display: block;    
    }
    .syoseki li{margin-right:0; margin-bottom:6rem; text-align: center;}
    .syoseki img{width:28rem;}
    .syoseki p{font-size:2.2rem;}

    .page h1{
        font-size: 3.8rem;
        line-height: 5rem;
        margin-top:0.5rem;
    }

    .page .maintitle{
        font-size: 3rem;
        line-height: 3rem;
    }

    .page .subtitle{
        font-size: 1.8rem;
    }
    
    
    .page h2{
        font-size: 2.8rem;
    }
    
    .page h3{
        font-size: 2.4rem;
        line-height: 3rem;
    }

    .page ol li{
        margin-left:3.5rem;
        margin-bottom:1rem;
    }

    .text_s{font-size:1.7rem;}
    .text_m{font-size:2.0rem;}
    .text_mm{font-size:2.2rem;}
    .text_l{font-size:3.4rem;}

    .head_wrap .panel p a {
        font-size: 1.4rem;
    }

    .copyright-wrap .panel .content p {
        font-size: 1.4em;
    }

    .enjya_box {
        display: block;
    }

    .enjya_box .left {
        width: 100%;
        text-align: center;
    }

    .enjya_box .left img {
        width: 22rem;
    }

    .enjya_box .right {
        width: 100%;
        padding-left: 0;
        padding-top:1.5rem;
        text-align: center;
    }

    .yotei_box {
    flex-direction: column;
    }

    .yotei_box .left {
        width: 100%;
        text-align: left;
        order: 2;
    }

    .yotei_box .left img {
        width: 22rem;
    }

    .yotei_box .right {
        width: 100%;
        padding-left: 0;
        padding-top:1.5rem;
        text-align: center;
        order: 1;
    }

    .gaiyou{
        padding:0;
    }

    .gaiyou ul{margin-top:3rem;}
    .gaiyou li{display: block; font-size:0.875rem; margin-bottom:0.188rem;}
    .gaiyou li p:first-child{font-weight:bold; width:100%; padding-top: 1rem; padding-bottom: 1rem; line-height:normal;}
    .gaiyou li p:last-child{width:100%; padding-top: 1.5rem; padding-bottom: 1.5rem;}


    .mailform ul{margin-top:3rem;}
    .mailform li{display: block; font-size:0.875rem; margin-bottom:0.188rem;}
    .mailform li p:first-child{font-weight:bold; width:100%; padding-top: 1rem; padding-bottom: 1rem; padding-left:1rem; box-sizing: border-box;}
    .mailform li p:last-child{width:100%; padding-top: 2.5rem; padding-bottom: 2rem; line-height:normal; padding-left:1.25rem; box-sizing: border-box;}

    .head_wrap .panel {
        width: 100%;
        padding-left:1rem;
    }

    .kaisai_wrap {
        margin:0;
        justify-content: flex-start;
    }

    .kaisai_block {
        width: 18rem;
        padding:0.2rem 0;
        margin:0 0 4rem 1rem;
        font-size: 2rem;
        font-weight: bold;
    }

    .pdf_dl {
        font-size: 2.4rem;
    }

    .pdf_dl a {
        width: 34rem;
        padding: 1.8rem;
        margin:4rem auto;
        border-radius: 1rem;
    }

    .button_flex{
        list-style: none;
        display: block;
    }

    .button_back{
        font-size:2.4rem;
    }
    .button_back a{
        width: 34rem;
        padding: 1.8rem;
        margin:4rem auto;
        border-radius: 1rem;
    }

    input {
        font-size:2rem;
        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;
    }

    .textarea_width02{
        width:98% !important;
        height:6rem !important;
    }
    
    .hissu {
        font-size:1.8rem;
        padding:0.1em 0.4em;
    }

    .red_box {
        padding: 1rem;
    }

    #page_top{
        width: 7rem;
        height: 7rem;
    }

    #page_top a{
        width: 7rem;
        height: 7rem;
    }

    #page_top a::before{
        font-size: 3rem;
        width: 3rem;
        height: 3rem;
        top: -5px;
      }
      .miryoku{
        width:100%;
        margin:0 auto;
    }    

    .program img{width:30%;}
    .program li{display: block; margin-bottom:2rem;}
    .program li p:first-child{text-align:left; width:100%; padding: 1.5rem;}
    .program li p:last-child{width:100%; padding:2rem;}

    .caption2 {
        width:90%;
    }

    .caption3{
        padding:2rem;
        width:100%;
        box-sizing: border-box;
    }

    .caption3 p{
        font-size: 1.7rem;
    }

    .caption4{
        width:100%;
    }

    .caption4 p{
        font-size: 1.7rem;
    }

    .item_m{
        font-size:2rem;
        width:100%;
        padding:10px;
        margin:0 auto;
    }

    .line_s{line-height:2.8rem;}

    .subt_maru_blue{
        border-radius: 2rem;
        width:95%;
        text-align: center;
        margin:2rem auto;
    }


    .kouen_box{

    }
    
    .subt_box{
        display: block;
        text-align: center;
    }
    
    .subt_box .left{
        width:auto;
    }
    
    .subt_box .right{
        width:auto;
    }
    
    .gaiyou ul{margin-top:3rem; padding:1rem;}
    .gaiyou li{display: block; font-size:0.875rem; margin-bottom:0.188rem; border-bottom :0;}
    .gaiyou li p:first-child{font-weight:bold; width:100%; padding-top: 1rem; padding-bottom: 1rem; line-height:normal;}
    .gaiyou li p:last-child{width:100%; padding-top: 1.5rem; padding-bottom: 1.5rem;}

}