@charset "utf-8";
/*-------------------------------------------------------------
 色 ・　文字
---------------------------------------------------------------*/
:root{
    --color1: #244682;/*#00CE8E*/
    --color1_text: #244682;/*#00A56E*/
    --color2: #efefef;
    --color3: #aab8cf;/*#FCFC56*/
    --color4: #deeeff;/*#e1f9e2;*/
    --yellow: #FFFD54;
    --black: #222222;
    --base: #F7F7F6;
    --font1: 16px;
    --title1: 38px;
    --kadomaru: 0px;
}

/* スマホ */
@media screen and (max-width: 667px){
    :root{
        --fontB1: 22px;
        --title1: 28px;
        --kadomaru: 0vw;
    }
}
html,body,.font_10,.font_11,.font_12,.font_13,.font_14,.font_15,
.font_10_tb,.font_11_tb,.font_12_tb,.font_13_tb,.font_14_tb,.font_15_tb,
.font_10_sp,.font_11_sp,.font_12_sp,.font_13_sp,.font_14_sp,.font_15_sp{font-size: var(--font1);}
.font_2up{font-size: max(calc(var(--font1) + 2px), calc(1rem  + 2px));}
.font_4up{font-size: max(calc(var(--font1) + 4px), calc(1rem  + 4px));}
.font_2dw{font-size: max(calc(var(--font1)), calc(1rem  - 2px));}
.font_4dw{font-size: max(calc(var(--font1)), calc(1rem  - 4px));}
.font_6dw{font-size: max(calc(var(--font1)), calc(1rem  - 6px));}


.base_color{background-color: var(--base);} /* ベースカラー　全体の背景色 */

.txt_white, .hvr_txt_white:hover{color: white;}
.txt_red, .hvr_txt_red:hover{color: #C12326;}
.txt_gray, .hvr_txt_gray:hover{color: #ccc}
.txt_color1, .hvr_txt_color1:hover{color: var(--color1_text)} /* メインカラー */
.txt_color2, .hvr_txt_color2:hover{color: var(--color2)} /* サブカラー */
.txt_color3, .hvr_txt_color3:hover{color: var(--color3)} /* アクセントカラー1 */
.txt_color4, .hvr_txt_color4:hover{color: var(--color4)} /* アクセントカラー2 */

/* background-color */
.bg_white, .hvr_bg_white:hover{background-color: white} /* 白背景 */
.bg_black, .hvr_bg_black:hover{background-color: var(--black)} /* 黒背景 */
.bg_gray, .hvr_bg_gray:hover{background-color: #ccc}
.bg_color1, .hvr_bg_color1:hover{background-color: var(--color1)} /* メインカラー */
.bg_color2, .hvr_bg_color2:hover{background-color: var(--color2)} /* サブカラー */
.bg_color3, .hvr_bg_color3:hover{background-color: var(--color3)} /* アクセントカラー1 */
.bg_color4, .hvr_bg_color4:hover{background-color: var(--color4)} /* アクセントカラー2 */
.bg_color_clear, .hvr_bg_color_clear:hover{background-color: transparent!important}


/* border-color ※!important */
.border_white, .hvr_border_white:hover{border-color: white}
.border_black, .hvr_border_black:hover{border-color: var(--black)}
.border_gray, .hvr_border_gray:hover{border-color: #ccc}
.border_color1, .hvr_border_color1:hover{border-color: var(--color1_text)}
.border_color2, .hvr_border_color2:hover{border-color: var(--color2)}
.border_color3, .hvr_border_color3:hover{border-color: var(--color3)}
.border_color4, .hvr_border_color4:hover{border-color: var(--color4)}

.loader_txt, .cms_title h2, #catch h2, #question h2, #contents h2, #contents .box h3, #top_cms .cms_title h2, #page_title h2{
   font-family:"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}
.en_font{
   font-family:"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}

/*-------------------------------------------------------------
 テンプレート調整
---------------------------------------------------------------*/
header{background-color: var(--color1);}
.cms_link{
    top: 50%;
    transform: translateY(-50%);
}
.cms_link div a{
        border-radius: 0px 0 0 0px;
    border-top: 2px solid var(--base);
    border-left: 2px solid var(--base);
    border-bottom: 2px solid var(--base);
}
.page-top{bottom: 0px;}
.page-top a{
    border-top: 2px solid var(--base);
    border-left: 2px solid var(--base);
    border-radius: 0px 0 0 0;
}
#catch .box{
    margin: 0 auto;
    width: 80%!important;
    background-color: #fff;
    border-radius: var(--kadomaru);
}
#catch .box .title{
    margin: 0 0 30px;
    text-align: center;
}


#contents{
    background-color: var(--color4);
    padding-top: 130px;
}
#contents .box{
    overflow: hidden;
        align-items: stretch;
    border-radius: var(--kadomaru);
    box-shadow: 3px 5px 0px var(--color1);
}
#contents .box .box_item:before{
    display: none;
}
#contents .box .box_item{
    background-color:#fff;
}
#contents .box.con2,#contents .box.con3{
    margin-top: 80px;
}
#contents .box figure,
#contents .box .box_item{
    width: 50%!important;
    margin: 0!important;

}


#question .check_box{}
#question .check_text{
    width: calc(100% - 60px);
}
#question .check{
    width: 60px;
}
#question .txt:before{
    top: 50%;
    transform: translateY(-50%);
}
#question .txt .check{
    width: 35px;
    top: -3px;
    left: -10px;
    padding: 0;
}
#question .txt .check.txt_color3{
    color: var(--yellow);
}

footer .footer_con_box .footer_con{
    box-sizing: border-box;
    border: 2.5px solid var(--color1_text);
    border-radius: var(--kadomaru) 0 0 var(--kadomaru);
}
footer .footer_con_box .footer_tel{
    box-sizing: border-box;
    border: 2.5px solid var(--color1_text);
    border-left: none;
    border-radius: 0 var(--kadomaru) var(--kadomaru) 0;
}

/* タブレット */
@media screen and (max-width: 768px){
    #contents{padding-top: 100px;}
    #contents .box .box_item{
        padding: 30px 5%;
    }

    
    #contents .box {
        overflow: hidden;
        border-radius: var(--kadomaru);
        box-shadow: 3px 5px 0px var(--color1);
    }
    #contents .box figure{
        width: 100%!important;
        border-radius:0;
    }
    #contents .box .box_item{
        box-shadow: none;
        width: 100%!important;
        margin: 0px auto 0!important;
        border-radius: 0;
    }

    #question .txt{
        width: 47%;
        margin-right: 5%;
    }
    .footer_cms{
        text-align: center;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .cms_link{
        top: auto;
        bottom: 0px;
        transform: translateY(0%);
    }
    .cms_link div a{
        border-radius: 0;
        border-top: 2px solid var(--base);
        border-left: none;
        border-bottom: none;
    }
    .page-top{bottom: 53px;}
    .page-top a{
        border-radius: 20px 0 0 0;
        border-top: 2px solid var(--base);
        border-left: 2px solid var(--base);
    }
    #question .box .box_item{
        padding: 30px 5%;
    }
    #question .txt .check{
        width: 30px;
        padding: 0;
        left: -6px;
        top: 0;
    }
    #question .check_text{
        width: calc(100% - 50px);
        letter-spacing: 0em;
    }
    #question .txt{
        width: 100%;
        margin-right: 0%;
    }
    
    #contents{padding-top: 40px;}
    
    footer .footer_con_box .footer_con{
        border-radius: var(--kadomaru) var(--kadomaru) 0 0;
        border-bottom: none;
    }
    footer .footer_con_box .footer_tel{
        border-radius: 0 0 var(--kadomaru) var(--kadomaru);
        border-left: 2.5px solid var(--color1_text);
    }
}

/*-------------------------------------------------------------
 top, all
---------------------------------------------------------------*/
 #page_title h2, #contents .box h3{
    font-size: var(--title1);

}

.top_cms_box.cms1{
    background-color: var(--color4);
    margin: 0 auto;
    padding: 100px 5%;
}

#catch .box .title{
    font-size: calc(var(--title1) + 4px);
    font-weight: bold;
    padding: 0px;
    background-color: transparent;
    color: var(--color1);
    border-bottom: 3px solid var(--color1);
}

#catch,#page_title{
    background-color: var(--color1);
/*	background-image: url("../dup/img/loop.png")!important;*/
/*	background-size: 200px;*/
/*	background-position: top 0 left 0;*/
/*	background-repeat: repeat;*/
/*	animation: bgloop 20s linear infinite;*/
}
/*@keyframes bgloop {*/
/*	0% {background-position: top 0 left 0;}*/
/*	100% {background-position: top -400px left 400px;}*/
/*}*/





#contents{}


#contents .box h3{
    color: var(--color1_text);
}

#page_title .title{
    /*border-radius: 80px;*/
    bottom: 0%;
    left: 50%;
    transform: translate(-50%, -50%);
}
footer .footer_con_box a:hover{
    color: var(--color1_text);
}

.footer_tel{
    color: var(--color1_text);
}
footer .footer_con_box a.footer_tel:hover{
    color: var(--base);
}
#contents .box{
    position: relative;
    z-index: 2;
}

#contents{
    position: relative;
}
/*
#contents::before {
	position: absolute;
	z-index: 1;
	opacity: 1;
	content: "";
	left: 0;
	bottom: 0;
	width: 200px;
	height: 100%;
	background-image: url("../dup/img/loop2_tate.png");
	background-size: 200px;
        background-repeat: repeat-y; 
        animation: loop2 30s linear infinite;
}
@keyframes loop2 {
	0% {background-position-y: 1280px;}
	100% {background-position-y: 0;}
}
*/
/*
#contents::after {
    position: absolute;
	z-index: 1;
	opacity: 1;
	content: "";
	right: 0;
	bottom: 0;
	width: 200px;
	height: 100%;
	background-image: url("../dup/img/loop3_tate.png");
	background-size: 200px;
        background-repeat: repeat-y; 
        animation: loop3 30s linear infinite;
}
@keyframes loop3 {
	0% {background-position-y: 1280px;}
	100% {background-position-y: 0;}
}
*/
/* タブレット */
@media screen and (max-width: 768px){
    #contents .box h3{
        text-align: center;
    }
    #catch .box{
        width: 90%!important;
        border-radius: var(--kadomaru);
    }
    #catch .box .title{
        font-size: calc(var(--title1) - 4px);
    }

}
/* スマホ */
@media screen and (max-width: 667px){
    #catch,#page_title{background-size: 150px;}
    #page_title{margin-top: 55px;}
    #page_title .title{
        border-radius: 0;
        width: 100%!important;
    }
    #catch .box .title{
        font-size: calc(var(--title1) + 0px);
    }
    #contents::before {
        width: 30vw;
        background-size: 30vw;
        animation: loop2sp 30s linear infinite;
    }
    #contents::after {
        width: 30vw;
        background-size: 30vw;
        animation: loop3sp 30s linear infinite;
    }
}
@keyframes loop2sp {
	0% {background-position-y: 192vw;}
	100% {background-position-y: 0;}
}
@keyframes loop3sp {
	0% {background-position-y: 192vw;}
	100% {background-position-y: 0;}
}
/*-------------------------------------------------------------
　ヘッダー,logo
---------------------------------------------------------------*/
.top_loader .logo{margin: 0 auto;}
.button_container span{    height: 3px;}
header.clone-nav{padding: 15px 0;}
header .logo, header .logo img,
.all_page header .logo img{
    height: 54px!important;
}

/* タブレット */
@media screen and (max-width: 768px){
    header.clone-nav{
        padding: 15px 0;
    }
    header .logo, header .logo img,
    .all_page header .logo img{
        height: 50px!important;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .button_container{top: -10px;}
    .top_loader .logo{
        max-width: 140px;
        margin: 0 auto;
    }
    header .logo, header .logo img,
    .all_page header .logo img{
        height: 35px!important;
        
    }
}

/*-------------------------------------------------------------
 cms1
---------------------------------------------------------------*/
.cms_1-g .date{max-width: 140px;}
/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 cms2
---------------------------------------------------------------*/
#cms_3-e .cate_title{
    background-color: var(--color1);
}
#cms_3-e .cate_title{
    font-size: 1.8rem;
    font-weight: bold;
    padding: 10px 3%;
}
/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    #cms_3-e .cate_title{font-size: 1.5rem;}
}
/*-------------------------------------------------------------
 cms3
---------------------------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 cms4
---------------------------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 cms5
---------------------------------------------------------------*/

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 プライバシーポリシー
---------------------------------------------------------------*/



/*-------------------------------------------------------------
 お問い合わせ
---------------------------------------------------------------*/


/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}
/*-------------------------------------------------------------
 サイトマップ、プライバシーポリシー
---------------------------------------------------------------*/
#google_privacy{background-color: var(--color4);}

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}

/* -------------------------------------------------------------
 リンクボタン 
--------------------------------------------------------------*/
.more_txt2{color: var(--color1_text);}

.linkStyle,a{
	color: var(--color1_text);
	text-decoration: underline;
	transition: all 0.5s;
}
a{
    text-decoration: none;
}
.linkStyle:hover,a:hover{
	opacity: 0.7;
	text-decoration: none;
}

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){}

/* -------------------------------------------------------------
 メインイメージ 
--------------------------------------------------------------*/
.main_img_wrap{
    width: 100%;
    background-color: transparent;
}

/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    .main_img_wrap{
        margin-top: 20px;
    }
}