﻿#bnr{
    z-index: 5;
    right: 50px;
}
#bnr a{
    width: 250px;
    height: 50px;
    background-color: #ffa08d;
    color: #fff;
    text-align: center;
        text-align: center;
    font-size: 1.3rem;
    line-height: 50px;
}
@media screen and (max-width: 667px){
    #page-top,#bnr{bottom: 0!important;}
    #bnr{width: calc(100% - 50px);}
    #bnr a{display: block; width: 100%;}
}
/*---------------------------------------------
 テンプレート ・CMS・下層ページ 
--------------------------------------------*/

.more a{color: #5a5a5a;}
.more a:hover{color: #5a5a5a;}
#page-top a::before{
    border-top: solid 1px #fb7b61;;
    border-right: solid 1px #fb7b61;
}

#contents2 .about{
    width: 42%;
    padding: 20px 3%;
    border-radius: 20px;
    letter-spacing: 0em;
}
#contents2 .about.text1{background-color: rgba(255, 160, 141, 0.7);padding: 24px 3%;}
#contents2 .about.text2{background-color: rgba(255, 223, 169, 0.7); line-height: 1.7;}
#contents2 .con_text{}
#contents2 .about.text1 .highlight{
    font-weight:bold;
    color: #ff6f52;
    background-color: #fff;
    padding: 0 5px;
    border-radius: 5px;
}
#contents2 .about.text2 .highlight{
    font-weight:bold;
    color: #ff8100;
    background-color: #fff;
    padding: 0 5px;
    border-radius: 5px;
}

#contents3 .con3_wrap{background-color: #fff3e6;}

.con3_title span{ margin: 0 auto;}

.under_page #footer,
#footer .footer_bottom{background-color: #fff3e6;}
.under_page #footer, #footer .footer_bottom{padding-bottom: 70px;}

.pager li a{background-color: #fff3e6; color: #fd8d76;}
.pager li a:hover{background-color: #ffa08d; color: #fff;}
#cms_2-g .cate_txt1{}

#page07 p,#page09 .privacy_top{background-color: #fff3e6;}
#contact_tel a{    color: #ff6e51;}
#page09 a{background-color: #fff3e6; color: #bd4600;}
#page09 a:hover{background-color: #ff9a86; color: #fff;}

/* タブレット */
@media screen and (max-width: 768px){
    .more a{color: #ff794e!important;}
    .con2_title{margin: 0 auto 50px; text-align: center;}
    .con2_title span, .con3_title span{margin: 0 auto;}
    
    .under_page #footer, #footer .footer_bottom{padding-bottom: 0px;}
}
/* スマホ */
@media screen and (max-width: 667px){
    #contents2 .about{width: 100%;}
    #contents2 .about.text1{margin-bottom: 30px;}
    #contents2 .con2_wrap{padding: 50px 9%;}
    #contents3 .con3_wrap{padding: 50px 5%;}
    
    
    
    .con2_left{text-align: center;}
    .con2_title span, .con3_title span{margin: 0 auto;}
    .con1_title h2{width: 220px; margin: 0 auto 50px;}
    .con2_title h2{width: 260px; margin: 0 auto 10px;}
    
    #page_title{padding-top: 0; margin-top: 80px; background-size: 110%;}
    #page_title .page_title_box{padding: 50px 5%; text-align: left;}
    
    .under_page #footer, #footer .footer_bottom{    padding-bottom: 30px;}
}

/*箇条書の箇所 ----------------------------------------*/
.txt .check_text .highlight{
    color: #ff7054;
    font-weight: 700;
}
.check_box{width: 48%;}

.txt{
    width: 70%;
    background-color: #fff;
    border-radius: 15px;
    padding: 15px 25px;
    font-size: 1.1rem;
    text-align: left;
    margin: 0 auto 20px;
}
.txt .check_icon{
    width: 25px;
    margin-right: 20px;
    transform: translateY(-3px);
}
.txt .check_text{
    width: calc(100% - 45px);
    letter-spacing: 0em;
    line-height: 2;
    font-weight: 500;
    color: #414141;
}
.check_line{
    color: #dd6d0c;
    border-bottom: 5px solid;
}
/* タブレット */
@media screen and (max-width: 768px){
    .check_box{width: 80%;}
    .txt{}
    .txt .check_text{}
    .check_line{}
    .txt .check_icon{}
    .txt .check_text{width: calc(100% - 45px);}
}
/* スマホ */
@media screen and (max-width: 667px){
    .check_box{width: 100%;}
    .txt{padding: 10px 5px; text-align: center;width: 90%;}
    .txt .check_icon{margin: 0 auto 5px;width: 25px;}
    .txt .check_text{width: 100%; letter-spacing: -0.03em;}
    .check_line{border-bottom: 4px solid;}
}

/* ---------- top modal ---------- */
html.modalset{
	overflow: hidden;
}
main.modalset {
    transform: none;
}
#contents2 .con1_modal{
    margin: 5px auto 0;
}
#contents2 .modal_btn{
    cursor: pointer;
    color: #222;
    padding: 15px;
    letter-spacing: 3px;
    font-size: 14px;
    display: block;
    margin: 0 auto;
    width: 150px;
        text-align: center;
}
#contents2 .modal_btn i{}
#contents2 .modal_btn:hover{
    opacity: 0.5;
}
#contents2 .modal_btn:hover i{

}
#contents2 .modal .box_title1{
    margin: auto;
    margin-bottom: 67px;
    width: 100%;
    font-size: 1.7rem;
}
#contents2 .modal{
	display: none;
	width: 100%;
	height: 100vh;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 9998;
	line-height: 2;
}
#contents2 .modal-wrap{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	text-align: center;
	padding: 20px;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: none;
	overflow: -moz-scrollbars-none;
}
#contents2 .modal-wrap::-webkit-scrollbar{
	display: none;
}
#contents2 .modal-wrap:after{
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 1px;
	height: 100%;
}
#contents2 .modal-bg{
    position: absolute;
    left: 0;
    top: 0;
    background: rgb(255 160 141);
    width: 100%;
    height: 100%;
}
#contents2 .modal-box{
    width: 90%;
    max-width: 1100px;
    box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding: 10px;
    padding-bottom: 23px;
    border-radius: 22px;
}
#contents2 .modal-box .inner{
	max-height: 100%;
    overflow: auto;
	-ms-overflow-style: none;
	color: #fff;
}
#contents2 .modal-box .inner::-webkit-scrollbar{
  width: 2px;
  height: 10px;
}
#contents2 .modal-box .inner::-webkit-scrollbar-track{
  border-radius: 5px;
  box-shadow: 0 0 4px #aaa inset;
}
#contents2 .modal-box .inner::-webkit-scrollbar-thumb{
  border-radius: 5px;
  background: #f9f8f7;
}
#contents2 .modal-box .modal-close {
    cursor: pointer;
    position: fixed;
    top: 7%;
    right: 15%;
    width: 30px!important;
    left: auto;
    z-index: 3;
}
#contents2 .modal_img{
    max-width: 600px;
}
#contents2 .modal_title1{
	padding-top: 60px;
}
#contents2 .modal_title1:before{
	content: "";
	display: block;
	background-color: #666; 
	width: 1px;
	height: 50px;
	position: absolute;
	top: 0;
	left: 2px;
}
#contents2 .modal_title1 span{
	transform: rotate(90deg);
	display: block;
	line-height: 1;
}
#contents2 .modal-box{
    vertical-align: top;
    margin-top: 80px;
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
    .font_10up{font-size: 1.4rem; letter-spacing: 0em;}
    #contents1 .fade_box{padding: 100px 50px;}
    #contents2 .modal-wrap{overflow: unset;}
    #contents2 .modal-box .modal-close{
        top: 45px;
        right: 25px;
        width: 45px;
        width: 38px!important;
    }
    #contents2 .modal-box{
        margin-top: 0px;
        padding: 20px 0 60px;
        width: 100%;
        height: 100%;
    }
    #contents2 .modal-box .inner{
        max-height: 100%;
        padding: 30px 0% 50px;
    }
    #contents2 .modal-box .inner .box_txt1{margin-bottom:50px}
    #contents2 .modal .box_title1{font-size: 1.4rem;letter-spacing: 0em;}
}

/* --------------------------------------------
 メインイメージ 
---------------------------------------------*/
.catch{
    max-width: 860px;
    width: 70%;
    position: absolute;
    bottom: 3%;
    left: 3%;
}
#header #logo{
    margin-left: 10%;
    padding: 30px;
    padding-right: 0px;
}
#header #logo a img{max-width: 280px;}
#main_img .box_img{background-position: 80%;}
.top #header{
    padding-left: 0;
    width: 27.33333%!important;
}
header .trans_header{
    top: -120px;
}
header .trans_logo{
    height: auto;
}
header .trans_logo img{
    max-width: 100px;
}
#main_img{
    width: 72.6667% !important;
}
.main_box{
    width: 47%;
    max-width: 800px;
    top: 13%;
    right: 47px;
}
@media screen and (max-width: 1280px){
    #main_img {
        width: 72.6667% !important;
        height: 750px!important;
    }
}
/* タブレット */
@media screen and (max-width: 768px){
    header .trans_logo{padding: 5px 20px;}
    header .trans_logo img{
        max-width: 70px;
    }
    header .trans_header{top: 0;}
    #main_img {
        width: 100% !important;
        height: 550px!important;
    }
    .catch{width: 90%;}
}
/* スマホ */
@media screen and (max-width: 667px){
    header .trans_logo img{max-width: 70px;padding-top: 0px;}
    #main_img {
        height: 380px!important;
    }
    #main_img .box_img{background-position: 80%;}
}


/*--------------------------------------------
 全体 
----------------------------------------------*/
.linkStyle{
	color: #fd8d76;
	text-decoration: underline;
	transition: all 0.5s;
}
.linkStyle:hover{
	color: #fd8d76;
	opacity: 0.7;
	text-decoration: none;
}


.txt_color1,.hvr_txt_color1:hover{color: #fd8d76;} 
.txt_color2,.hvr_txt_color2:hover{color: #ffd4a6;} 
.txt_color3,.hvr_txt_color3:hover{color: #fda51f;} 
/*.txt_color4,.hvr_txt_color4:hover{color: #eae4df;} */
/*.txt_color5,.hvr_txt_color5:hover{color: #f2ede7;}*/ 

.bg_color1,.hvr_bg_color1:hover{background-color: #ffa08d;}
.bg_color2,.hvr_bg_color2:hover{background-color: #ffdebb;}
.bg_color3,.hvr_bg_color3:hover{background-color: #ffdfa9;} 
/*.bg_color4,.hvr_bg_color4:hover{background-color: #eae4df;} */
/*.bg_color5,.hvr_bg_color5:hover{background-color: #f2ede7;}*/ 

.border_color1,.hvr_border_color1:hover{border-color: #fd8d76;}
.border_color2,.hvr_border_color2:hover{border-color: #ffdebb;}
.border_color3,.hvr_border_color3:hover{border-color: #fda51f;}
/*.border_color4,.hvr_border_color4:hover{border-color: #eae4df;}*/
/*.border_color5,.hvr_border_color5:hover{border-color: #f2ede7;}*/