﻿/*ボタン変える*/
.fix_banner,.fix_banner .more_item{max-width: 400px;}
.fix_banner .more_item{
        text-align: center;
    border-radius: 100px;
    padding: 10px 20px;
    background-color: #eb3600;
    border: none;
    background-color: #2BA500;
    box-shadow: 0px 6px 0px #1E7400;
}
.fix_banner .more_item .text{
    padding-left: 0px;
    font-size: 2rem;
    font-weight: 900;
}
.fix_banner .more_item:hover .text{
    padding-left: 0px;
}
.fix_banner .more_item:hover{
    background-color: #1E7400;
    box-shadow: 0px 1px 0px #1E7400;
    transform: translateY(5px);
}

.fix_banner .more_item::before{
    display: none;
}

/* スマホ */
@media screen and (max-width: 667px){
    .fix_banner .more_item .text{
        font-size: 1.5rem;
    }
    .fix_banner,.fix_banner .more_item{max-width: 310px;}
}

.contact_tel a{max-width: 330px; padding: 20px 10px;}
/* TOP追加 ------------------*/
#intro .intro_right{
    width: 100%;
}

#point1 h3,#point2 h3{
    width: 100%;
    text-align: center;
    font-weight: 900;
    padding: 30px 0;
}
#point1 .con_txt,#point2 .con_txt{letter-spacing: 0em; text-align: center;}
#point1 .con_img img,#point2 .con_img img{border-radius: 50%;}
#point1 .con_wrap .con_box,#point2 .con_wrap .con_box{
    margin: 10px;
    width: 20%;
}

.dec img{
    width: 30%;
    margin: 30px auto;
    display: block;
}
.img9 img{width: 100%;}

#point2{padding-top: 80px;}

#point2 h3{padding-top: 80px;}
#point2 .kadai{width:100%;}
#point2 .kadai .con_txt{
    width: 44%;
    padding: 30px 20px;
    margin: 1%;
    text-align: center;
    background-color: #fff;
    color: #690000;
    font-weight: 700;
    border-radius: 15px;
}
#point2 .top7{
    width: 30%;
    margin: -100px auto 0;
}
#point2 .kikikan{
    background-color: #690000;
    color: #fff;
    line-height: 1.7;
    padding: 20px 0;
}
#point2 .kikikan span{display: block;}


#point1 .con_wrap .con_box{width: 45%;}
.con_box_p{width: 50%;}

/* 改行しないようにする */
@media screen and (max-width: 1400px){
    .con_box_p{width: 100%;}
    #point1 .con_wrap .con_box{
        width: 23%;
        margin: 30px 3%;
    }
}

/* タブレット */
@media screen and (max-width: 768px){
    #point1 h3, #point2 h3{font-size: 28px;}
    #point1 .con_wrap .con_box, #point2 .con_wrap .con_box{
        margin: 0 30px 50px;
        width: 40%;
        min-width: 240px;
    }
    #point2{padding-top: 0px;}
    #point2 h3{padding-top: 50px;}
    #point2 .kadai .con_txt{width: 40%;}
    
    #point2 .top7{
        width: 40%;
        margin: -70px auto 0;
    }
    
}
/* スマホ */
@media screen and (max-width: 667px){
    #point1 .con_wrap .con_box, #point2 .con_wrap .con_box{
        margin: 10px auto 30px;
        width: 90%;
    }
    #point1 .con_img img, #point2 .con_img img{
        width: 90%;
        margin: 0 auto;
    }
    #point1 h3, #point2 h3{font-size: 28px;}
    #point2{padding-top: 0px;}
    #point2 h3{padding-top: 60px;}
    
    #point2 .kadai .con_txt{width: 90%;}
    #point2 .top7{
        width: 80%;
        margin: -10px auto;
    }
    #point2 .kikikan{padding: 10px 10px;line-height: 1.5;}
    #point2 .kikikan span{margin: 15px 0; display: block;}
}


/* CMS・下層ページ ----------------------------------*/
#page4 .tyui{
    margin-top: 50px;
    padding: 20px;
    background-color: #ccc;
}
#page6 .cate_box{padding-left: 0;}
/* cms_5-f -----------------------------------*/
#cms_5-f .cate_box .box_txt1::before, .cms_5-f .cate_box .box_txt1::before{
    content: "A.";
    position: absolute;
    left: 20px;
}
#cms_5-f .cate_box .box_txt1, .cms_5-f .cate_box .box_txt1{
    padding-left: 40px;
    position: relative;
}
/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    #cms_2-g .cate:last-child,
    .v_type2 .cate_box:last-child{margin-bottom: 20px;}
    #page6 .con_box{padding: 5% 0px;}
    #cms_5-f{padding-bottom: 0px;}
    #cms_5-f .cate_box .arrow, .cms_5-f .cate_box .arrow{left: -10px;}
    #cms_5-f .cate_box .open_bt .box_title1, .cms_5-f .cate_box .open_bt .box_title1{margin-left: 50px;}
    #cms_5-f .cate_box .box_item, .cms_5-f .cate_box .box_item{padding-left: 0;}
    #page9 .con_box{padding: 5% 1%;}
    #page9 .box_wrap h3{letter-spacing: 0em;}
    #page9 .box_wrap p{letter-spacing: 0.02em;line-height: 1.7;padding-left: 0px;}
}

/* メインイメージ -----------------------------------*/
/*.catch {*/
/*    display: none;*/
/*    z-index: 3;*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    right: 3%;*/
/*    transform: translate(0%, -50%);*/
/*    width: 50%;*/
/*}*/
.catch_2{
    z-index: 3;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
.catch_2 img{
    height: auto;
    width: 100%;
}
#main_img{
    background: url(./Dup/img/main_img.jpg) no-repeat;
    background-size: cover;
    background-position: center top;
}
#main_img:before{
    height: 55%;
    background-color:transparent;
    background: linear-gradient(90deg, #690000 0%, #a80c00 70%, #c92f00 100%);
}

@media screen and (min-width: 1500px){
    .catch_2{
        height: 100%;
        width: auto;
    }
    .catch_2 img{
        height: 100%;
        width: auto;
    }
}

/* タブレット */
@media screen and (max-width: 768px){
    #main_img{height: 50vh!important;}
    /*.catch{width: 85%;}*/
}
/* スマホ */
@media screen and (max-width: 667px){
    #main_img{
        height: 100vh!important;
        background: url(./Dup/img/main_img_sp.jpg) no-repeat;
        background-size: cover;
        background-position: center top;
    }
    #main_img:before{
        height: 36.5%;
    }
}

/* トップページ -------------------------------------*/
#contents .con_title{font-size: 40px;max-width: 540px;margin: 0 auto 30px;}
#contents_wrap .con_box_item .txt_left{font-size: 23px;}
.top_title{
    -webkit-clip-path: polygon(100% 0%, 100% 75%, 0% 100%, 0 25%);
  clip-path: polygon(100% 0%, 100% 75%, 0% 100%, 0 25%);  
}
.top_cms_box{background-color: #f5f5f5;}


/* タブレット */
@media screen and (max-width: 768px){
   #contents_wrap{padding-bottom: 0px;}
   #contents_wrap .con_box_item .txt_left{font-size: 20px;}
}
/* スマホ */
@media screen and (max-width: 667px){
    #intro_wrap{padding-bottom: 50px;}
    .intro_title1{font-size: 30px;}
    #contents_wrap .con_box_item .txt_left{font-size: 17px;}
    #contents .con_title{font-size: 21px; max-width: 300px; margin: 0 auto 30px;}
    #contents .con_title.con1{width: 290px;}
    #contents_wrap{padding: 50px 5%;margin-bottom: 0px;}
    .top_cms_box{margin-bottom: 30px;}
    
    .modal-box{
        width: 100%;
        top: 15%;
        height: 60vh;
    }
    .modal-box .inner{padding-top: 50px;}
    .modal_title1,.modal_title1:before,.modal-box:before{
        display: none;
    }
    .modal_title2{max-width: 250px; margin: 0 auto 20px;}
}

/* 全体 ---------------------------------------------*/
.linkStyle{
	color: #690000;
	text-decoration: underline;
	transition: all 0.5s;
}
.linkStyle:hover{
	color: #690000;
	opacity: 0.7;
	text-decoration: none;
}
.more_item .text{
    font-size: 17px;
    letter-spacing: 0em;
    padding-left: 40px;
}
/* タブレット */
@media screen and (max-width: 768px){
    footer .scroll{right: -15px;}
}
/* スマホ */
@media screen and (max-width: 667px){
    .overlay{background-color: rgba(0,0,0,0.8)!important;}
    .close-trigger{top: 90%;}
    
    #page_title_img{height: 150px;}
    footer .scroll{right: -35px;}
}

/* 配色 ----------------------------------------------*/
.more_item{background-color: #690000;border-color:#690000;}


/*テンプレート  -------------------------------------*/
body,.font_14,.font_12,.font_100per,.font_2dw,.font_2dw_tb,.font_2dw_sp,.font_14_sp{
    font-size: 20px;
}
.font_2up{font-size: 24px;}
.font_4up{font-size: 28px;}


/* v_type2 -------------------------------------------------*/
.v_type2 .demo_box {padding-top: 70px}
.v_type2 {counter-reset: number 0;}
.v_type2 .cate_box {padding: 50px 20px 30px;}
.v_type2 .cate_box:before {
    counter-increment: number 1;
    content: "0" counter(number);
    display: inline-block;
    position: absolute;
    top: -43px;
    left: 15px;
    z-index: 1;
    font-size: 80px;
    /*font-weight: 100;*/
    /*font-style: italic;*/
    color: #7d8291;
    font-weight: bold;
    /*background-color: #fff;*/
    background: linear-gradient(0deg, #ffffff 51%, transparent 48.5%);
    line-height: 1;
    padding: 0 5px 0 5px;
}
@media screen and (max-width: 667px){
.v_type2 .cate_box{padding: 42px 25px 25px;}
.v_type2 .cate_box:before{top: -27px;font-size: 48px;}
}

/* flow_type3 --------------------------------------------------*/
.flow_type3 .cate{counter-reset: box;}
.flow_type3 .cate_box{counter-increment: box;}
.flow_type3 .box_item{padding-top: 60px;}
.flow_type3 .box_title1{z-index: 0}
.flow_type3 .box_title1::before, .flow_type3 .box_title1::after{
	position: absolute;
	content: "";
	display: block;
	pointer-events: none
}
.flow_type3 .box_title1::before {
	content: "0"counter(box);
	font-size: 86px;
	color: #e3e3e3;
	left: 0;
	top: -70px;
	z-index: -1;
}
.flow_type3 .box_title1::after{
	width: 100%;
	height: 1px;
	bottom: 0;
	left: 0;
	background-color: #222
}
/*-------- スマートフォン --------*/
@media screen and (max-width: 667px){
.flow_type3 .box_title1::before{
	left: auto;
	right: 0;
	top: -50px
}
.flow_type3 .box_item {
    padding-top: 15px;
}
}


/* キャンペーンバナー */
.campaign{  display:block;
  -webkit-animation: cta_style8 2.0s infinite ease-in-out;
  animation: cta_style8 2.0s infinite ease-in-out;
}
@keyframes cta_style8 {
	0%, 100% {transform: scale(0.9);}
	50% {transform: scale(1.0);}
}
