html{font-size: 62.5%; height: 100%;}
body{font-size: 1.6rem; margin: 0px; padding: 0px; height: 100%;
    font-family: "font-family: "Noto Sans JP";";
    font-weight: 400;
    font-color:#585858;
}
.noto100 {font-weight:100;}
.noto200 {font-weight:200;}
.noto300 {font-weight:300;}
.noto400 {font-weight:400;}
.noto500 {font-weight:500;}
.noto600 {font-weight:600;}
.noto700 {font-weight:700;}
.noto800 {font-weight:800;}
.noto900 {font-weight:900;}

Div.clear{clear:both;}
img {
    max-width: 100%;
    height: auto;
    border-style:none;
}
.Pimg{width:50px; height:50px; border-radius: 25px;}
/*LINK-------------------------------------------------------------------------*/
a img { border-style:none; }
a{color:#4f67df; text-decoration: none;}
a:hover{color:#0023d1; text-decoration: none;}
a:visited{color:#4f67df; text-decoration: none;}
/*Fream------------------------------------------------------------------------------------------*/
@media screen and (min-width: 768px) {
    .Main {
        margin-left: auto;
        margin-right: auto;
        margin-top: 5px;
        text-align: left;
        padding: 0px;
        width: 1124px;
        background-color: #FFFFFF;
        position: relative;
        height: auto;
        min-height: calc(100% - 160px);
        word-wrap: break-word;
    }
}
@media screen and (max-width: 767px) {
    .Main {
        margin-left: auto;
        margin-right: auto;
        margin-top: 5px;
        text-align: left;
        padding: 0px;
        width: 100%;
        background-color: #FFFFFF;
        position: relative;
        height: auto;
        min-height: 100%;
        word-wrap: break-word;
    }
}
.ContLine100SLD {margin:0 auto; width:100%; height:100%; display: table; box-sizing:border-box; margin-top: -1px; border-collapse: collapse; text-align:left;}

.ContLine100 {margin:0 auto; width:100%; display: table; box-sizing:border-box; margin-top: -1px; border-collapse: collapse; text-align:left;}
.ContLine100 .row{display: table-row;}
.ContLineAl{width: 100%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine50F {margin:0 auto; width:50%; display: table; box-sizing:border-box; margin-top: -1px; border-collapse: collapse; text-align:left;}

.ContLine10{width: 10%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine25{width: 25%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine30{width: 30%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine40{width: 40%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine50{width: 50%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine40{width: 60%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContLine75{width: 75%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}

.ContLineAlF{width: 100%; box-sizing:border-box; border-collapse: collapse;}

.ContFloat100 {margin:0 auto; width:1240px; display: table; box-sizing:border-box; margin-top: -1px; border-collapse: collapse; text-align:left;}
.ContFloat100 .row{display: table-row;}
.ContFloat05{display:table-cell; width: 5%; box-sizing:border-box; border-collapse: collapse;}
.ContFloat10{width: 10%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}
.ContFloat15{display:table-cell; width: 15%; box-sizing:border-box; border-collapse: collapse;}
.ContFloat40{width: 40%; display:table-cell; box-sizing:border-box; border-collapse: collapse;}

.Va-t{vertical-align: top;}
.Va-m{vertical-align: middle;}
.Va-b{vertical-align: bottom;}

.Ta-c{text-align: center;}
.Ta-l{text-align: left;}
.Ta-r{text-align: right;}

.pd-A5{padding:5px;}
.pd-T5{padding-top:5px;}
.pd-B5{padding-bottom:5px;}
.pd-R5{padding-right:5px;}
.pd-R50{padding-right:50px;}
.pd-A20{padding:20px;}

.font120 {font-size: 120%; font-weight: bold;}
.font160 {font-size: 160%; font-weight: bold;}
.font200 {font-size: 200%; font-weight: bold;}
.actItemNameBg{background: #ffffdd;}

.Bod_B{border: 1px solid #232323;}
.P_Red{color:red;}
.Item_En{padding:20px 20px; background: #0d66c2; border-radius: 4px;}
.Item_En a{display: block; width: 100%; height: 100%; color:#ffffff;}

.Item_Ck{padding:20px 20px; background:#3f8b43; border-radius: 4px;}
.Item_Ck a{display: block; width: 100%; height: 100%; color:#ffffff;}

.MypageGo{padding:20px 20px; background:#FF5722; border-radius: 4px;}
.MypageGo a{display: block; width: 100%; height: 100%; color:#ffffff;}

.ListGo{padding:20px 20px; background:#ffd700; border-radius: 4px;}
.ListGo a{display: block; width: 100%; height: 100%; color:#ffffff;}

ul.cmarke01 {list-style-type: none; margin-left:14px; color:red;}
ul.cmarke01 li:before {content: '※.'; margin-left:-30px;}
.Pos_up{position: absolute; top: 685px; left:5px;}
/*HEAD------------------------------------------------------------------------------------------*/
#logo {max-width:50%; display:block; margin:0 auto;}
#logo img{max-height: 70px; width: :auto;}
nav{width: 100%; height: 70px; position: relative; background: #F6F6F6; z-index: 90;}

.drawer{display: flex; flex-direction: row; align-items: center; justify-content: space-between; position: relative; height: 70px; padding: 0 1em; z-index: 90;}

/*ナビゲーション部分*/
.menu ul {list-style-type: none;}
.menu ul li a {display:block; font-weight:bold;padding: 2em; background: #FFFFFF; border-bottom: 1px dotted #CCC; color:#333; text-decoration:none; z-index: 90;}


.menu ul li a:hover{background-color:rgba(0,0,0,0.5);color:orange;}


.menu{margin-top: -10px; margin-left:-40px; text-align:center; background-color:rgba(255,255,255,0.5); transition: 0.5s ease; -webkit-transform: translateX(100%); transform: translateX(-100%);}

/*OPEN時の動き*/
.menu.open { -webkit-transform: translateX(0%); transform: translateX(0%)}

/*トグルボタンのスタイルを指定*/
.Toggle {display: block; position: fixed; width: 42px; height: 42px; cursor: pointer; z-index: 3; right:15px;}
.Toggle span {display: block; position: absolute; width: 50px; border-bottom: solid 4px #333; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out;}

/*各ボーダー少しずつずらす*/
.Toggle span:nth-child(1) {top:5px;}
.Toggle span:nth-child(2) {top: 18px;}
.Toggle span:nth-child(3) {top: 32px;}
.Toggle.active span:nth-child(1) {top: 18px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg);}

.Toggle.active span:nth-child(2),
.Toggle.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*Form------------------------------------------------------------------------------------------*/
.bt_blue{width:300px; margin:0 auto; padding: 5px 20px; background:#0B318F; color:#FFFFFF; border: 1px solid #0B318F; border-radius: 4px; text-align: center;}
.bt_blue a{color:#FFFFFF;}
.panel {display: flex; flex-direction: column; max-width: 800px; padding: 30px 40px 40px; background: #fff;	margin:0 auto 20px auto;}
.toggle {position: relative;}
.field {width: 100%; padding: 15px; border: 0; border: 1px solid #e5e5e5; font-size: 14px;	margin-bottom: 10px}
.toggle .field {padding-right: 80px;}
.btn {display: flex; align-items: center;}
.toggle .btn {position: absolute; right: 10px; top: 5px; padding: 5px 8px; border-radius: 5px; background: #e5e5e5;}
.btn-input {position: absolute; z-index: -1; opacity: 0;}
.btn-label {font-size: 18px; cursor: pointer;}
.toggle .btn-label {width: 30px; text-align: center;}




@media screen and (min-width: 768px) {
    .container {
        box-sizing:border-box;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        max-width: 1100px;
        height:auto;
        padding: 0;
    }
    .Itemlist{float:left; box-sizing:border-box;  width: 19.5%; height:260px; margin: 2px;padding:5px; border-collapse: collapse; background: #ffffff; border: 1px solid #0081E9; border-radius: 4px;}
    .Itemlist .img {width: 200px; height: 200px;}
    .Itemlist .img img {width: 100%; height: 100%; object-fit: contain;}
    .mobile{display: none;}
}
@media screen and (max-width: 767px) {
    .container {
        box-sizing:border-box;
        position: relative;
        margin-left: auto;
        margin-right: auto;
        max-width: 400px;
        height:auto;
        padding: 0;
    }
    .Itemlist{float:left; width: 48%; height:230px; margin: 2px; box-sizing:border-box; padding:5px; border-collapse: collapse; background: #ffffff; border: 1px solid #0081E9; border-radius: 4px;}
    .Itemlist .img {width: 180px; height: 180px;}
    .Itemlist .img img {width: 100%; height: 100%; object-fit: cover;}
}


.Itemlist a{display: block; width: 100%; height: 100%;}

.swiper-container .swiper-slide .Slimg {max-width: 100%; max-height: 400px; vertical-align: middle;}
.swiper-container .swiper-slide .Slimg img{width: 100%; height: 100%; object-fit: cover;}


.prettyprint{
    border: none;
    background: #fafafa;
    color: #697d86;
}
/* footer */
/*-------------------------------------------------------------------------*/
.footer_Dummy{width: 100%; height: 80px;}
.footer{position: relative; bottom: 0; width: 100%; box-sizing:border-box; background: #F6F6F6; color: #036eb8; text-align: center; padding:0; z-index: 0;}
.footer_main{width: 100%; box-sizing:border-box; padding:0;}
.footer_copy{width: 100%;; box-sizing:border-box; background: #F6F6F6; color: #036eb8; text-align: center; padding:20px 0; font-family: 'Poppins', sans-serif;}

/*Form------------------------------------------------------------------------------------------*/
form.cmxform label.error, label.error {color: red;}

input.inputtext{width: 100%; margin:1px 0; box-sizing: border-box; background: #ffffff; border: 1px solid #036eb8; border-radius: 4px; padding : 4px; color : #333333; letter-spacing: .1em; line-height: 17px; overflow:hidden;}
input.inputtext:focus{background: #ffffc8; border: 1px solid #ff7f00;}
input.inputright{text-align:right;}

textarea.Basic100{
    font-size:100%;
    font-family: 'M PLUS Rounded 1c';
    border: 1px solid #036eb8;
    border-radius:4px;
    width:100%;
    box-sizing:border-box;
    padding: 4px;
}
textarea.Basic100:focus{background: #ffffc8; border: 1px solid #ff7f00;}

.button_submit{
    border:1px solid #ffad41; font-size: 110%; padding: 20px 40px 20px 40px; border-radius: 6px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
    background-color: #ffc579; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc579), to(#fb9d23));
    background-image: -webkit-linear-gradient(top, #ffc579, #fb9d23);
    background-image: -moz-linear-gradient(top, #ffc579, #fb9d23);
    background-image: -ms-linear-gradient(top, #ffc579, #fb9d23);
    background-image: -o-linear-gradient(top, #ffc579, #fb9d23);
    background-image: linear-gradient(to bottom, #ffc579, #fb9d23);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffc579, endColorstr=#fb9d23);
}
.button_submit:hover{
    border:1px solid #ff9913;
    background-color: #ffaf46; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffaf46), to(#e78404));
    background-image: -webkit-linear-gradient(top, #ffaf46, #e78404);
    background-image: -moz-linear-gradient(top, #ffaf46, #e78404);
    background-image: -ms-linear-gradient(top, #ffaf46, #e78404);
    background-image: -o-linear-gradient(top, #ffaf46, #e78404);
    background-image: linear-gradient(to bottom, #ffaf46, #e78404);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffaf46, endColorstr=#e78404);
}
.button_submit:disabled{margin:0;
    border:1px solid #d7dada; font-family:arial, helvetica, sans-serif; padding: 10px 20px 20px 10px; border-radius: 6px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #D8D8D8;
    background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
    background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
    background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd);
}

.delbut{
    border:1px solid #8bcf54; font-size: 110%; padding: 4px 10px 4px 10px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
    background-color: #a9db80; background-image: -webkit-gradient(linear, left top, left bottom, from(#a9db80), to(#96c56f));
    background-image: -webkit-linear-gradient(top, #a9db80, #96c56f);
    background-image: -moz-linear-gradient(top, #a9db80, #96c56f);
    background-image: -ms-linear-gradient(top, #a9db80, #96c56f);
    background-image: -o-linear-gradient(top, #a9db80, #96c56f);
    background-image: linear-gradient(to bottom, #a9db80, #96c56f);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#a9db80, endColorstr=#96c56f);
}

.delbut:hover{
    border:1px solid #74bf36;
    background-color: #8ed058; background-image: -webkit-gradient(linear, left top, left bottom, from(#8ed058), to(#7bb64b));
    background-image: -webkit-linear-gradient(top, #8ed058, #7bb64b);
    background-image: -moz-linear-gradient(top, #8ed058, #7bb64b);
    background-image: -ms-linear-gradient(top, #8ed058, #7bb64b);
    background-image: -o-linear-gradient(top, #8ed058, #7bb64b);
    background-image: linear-gradient(to bottom, #8ed058, #7bb64b);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#8ed058, endColorstr=#7bb64b);
}

