@charset "utf-8";
/* CSS Document */

/* ページの初期値設定 */
html,body {
	width:100%;
	min-width:1000px;
}
body {
	color:#3E3A39;
	font-family: "Arial","メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
	text-align: left;
	background-color: #f0e8e5;
	line-height: 1.5;
}

/* 画像の初期値設定 */
img {
	vertical-align: top;
	border: none;
}

/*リンクの初期設定*/
a {
	color:#3E3A39;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

/* レイアウト */
#wrapper {
	position: relative;
	width: 100%;
}


input[type="text"],
textarea,
select{
	padding:5px;
	font-size:16px;
	line-height:1.5;
	-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 5px;   /* Firefox用 */
	border-radius: 5px;        /* CSS3草案 */
	border:solid 1px #CCC;
	background-color: #f9f9f9;
	box-sizing: border-box;
}
input[type="text"],
select{ width:100%; height:40px;}
textarea{ width:100%; height:134px;}

input[type="checkbox"],
input[type="radio"]{margin-right:3px;	vertical-align:middle;}
select option,
label{	font-size:13px;line-height:40px;}


.checkbox1 {
	min-width: 20px;
	vertical-align: top;
	display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
  color: rgba(0, 0, 0, 0.7);
  user-select: none;
}
.checkbox1 input {
    display: none;
  }
.checkbox1 .check {
	height: 20px;
  width: 20px;
	border: 2px solid #CCC;
	background-color: #FFF;
  border-radius: 4px;
  box-sizing: border-box;
  position: relative;
	display: inline-block;
}
.checkbox1 .check,
.checkbox1 .span_checkbox{
	cursor: pointer;	
}
.checkbox1 .check:before {
	content: "";
	width: 4px;
	height: 8px;
	position: absolute;
	left: 6px;
	top: 2px;
	border: 1px solid #FFF;
	border-width: 0 3px 3px 0;
	transform: rotate(45deg);
	opacity: 0;
 }
.checkbox1 input:checked + .check,
.checkbox1 input:checked + .span_checkbox .check {
	border-width: 1px;
	border-color: #79191d;
	background-color: #79191d;
	flex-shrink: 0;
}
.checkbox1 input:checked + .check:before,
.checkbox1 input:checked + .span_checkbox .check:before{
	opacity: 1;
}
.checkbox1 .span_checkbox{
	display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: start;
	line-height: normal;
}
.checkbox1 .span_checkbox .check{
	margin-right: 5px;
}


.input300 select{ width:300px; }

.attention,
.form_error{ color:#E53828;}


/*色*/
.Cg { color: #79191d;}
.Cr { color: #e53828;}
.Co { color: #f08200;}
.Cy { color: #ffe33f;}


/*/// header ///
//////////////////////////////////////////////// */
#float_area{
	position:relative;
	width:100%;
	height:120px;
	background-color: #79191d;
}
#INDEX #float_area{
	background-color: inherit;
}
#INDEX #float_area #float_obj{ 
	position:absolute;
}
#float_area #float_obj{
	width: 100%;
	position:fixed;
	top:0;
	left:0;
	z-index:10000000000000000000;
}

/*サイドバナー*/
#float_area #float_obj_main{
	width: 100%;
	/*margin-top: 20px;*/
	position:fixed;
	top:0;
	/*left:50%;*/
	/*transform: translateX(-50%);*/
	border: 1px solid #EEE;
	/*border-radius: 60px;*/
	box-shadow: 0 0 20px rgb(243 247 234 / 100%);
	background: #FFF;
}
#bnr_sidel {
	position: relative;
}
#bnr_sidel #bnr_sidel_pos{
	position:absolute;
	width: 80px;
	top :260px;
	left:20px;
	background-color:#FFF;
	border-radius: 40px;
}
#bnr_sidel #bnr_sidel_pos #bnr_sidel_contact,
#bnr_sidel #bnr_sidel_pos #bnr_sidel_about{
	width: 80px;
	line-height: 80px;
	font-size: 20px;
	text-align: center;
	box-sizing: border-box;
	color: #FFF;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	display: block;
	z-index:10;
}
#bnr_sidel #bnr_sidel_pos #bnr_sidel_contact {
	height: 280px;
  background: linear-gradient(to bottom, #ec5c4a 0%, #e53828 100%);
	/*border-radius: 40px 40px 0 0;*/
}
#bnr_sidel #bnr_sidel_pos #bnr_sidel_about {
	height: 340px;
  background: linear-gradient(to bottom, #f08200 0%, #f49c00 100%);
	/*border-radius: 0 0 40px 40px;*/
}
#bnr_sidel #bnr_sidel_pos .ic_mail,
#bnr_sidel #bnr_sidel_pos .ic_home{
	display: inline-block;
	margin-bottom: 10px;
}
#bnr_sidel #bnr_sidel_pos .ic_mail{ width: 30px; height: 22px; background: url("../img/ic/ic_mail.svg") left top / auto 100% no-repeat}
#bnr_sidel #bnr_sidel_pos .ic_home{ width: 35px; height: 35px; background: url("../img/ic/ic_home.svg") left top / auto 100% no-repeat}

/*ヘッダー*/
#header_in {
	width: 980px;
	margin: 0 auto;
	height: 60px;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-justify-content:space-around;
	-ms-flex-pack:distribute;
	justify-content:space-around;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
#header_name{
	display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
#header_logo{
	width: 160px;
	height: auto;
	margin-right: 30px;
}
#header_info{
	margin :10px;
	padding: 10px;
	background-color: #f08200;
	border-radius: 5px;
	line-height: 1;
	color: #FFF;
	font-size: 12px;
	font-weight: bold;
	display: block;
	letter-spacing: 1px;
	box-sizing: border-box;
}
#header_txt{
	width: 350px;
	color:#727171;
	font-size:10px;
	line-height: 120%;
}
#header_cnt{
	display : -webkit-inline-box;
	display : -ms-inline-flexbox;
	display : -webkit-inline-flex;
	display : inline-flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-flex:1;
	-ms-flex:1;
	flex:1;
	font-size:14px;
}
#header_cnt dl{
	font-size:14px;
}
#header_cnt dl dt,
#header_cnt dl dd{
	display:inline-block;
	*display:inline;
	*zoom:1;
}
#header #header_cnt dl dd span{
	font-weight:bold;
	font-size:20px;
	line-height:20px;
	margin-right:2px;
	margin-left:2px;
}
#header_cnt dl#header_cnt_k{
	margin-left: 4px;
	border-left: 1px solid #DDD;
	padding-left: 4px;
}
#header_cnt dl#header_cnt_j{
	width: 100%;
	flex-wrap: wrap;
}
#header_cnt dl#header_cnt_j .txt_m{
	margin-right:0;
	margin-left :0;
	font-size: 16px;
}
#header_cnt dl#header_cnt_s dd span,
#header_cnt dl#header_cnt_j dd span{ color:#E53828;}
#header_cnt dl#header_cnt_k dd span{ color:#8DC21F;}


/*/// contentns ///
//////////////////////////////////////////////// */
#contents_wrap{
	padding-bottom: 100px;
	z-index: 1;
	position: relative;
}

#contents{
	width:1100px;
/*
	margin-top: 50px;
*/
	margin-left:auto;
	margin-right:auto;
}
#INDEX #contents{
	width:inherit;
	margin-top: auto;
}


/*#key*/
#key_box{
	width: 100%;
	height:350px;
	position: relative;
	background-color: #FFF;
	/*background:url(../img/common/top_image_bg_c.png) bottom center / 1800px auto no-repeat;*/
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;	
}	
/*
#key_box:before{
	content: '';
	top: 0;
	right: 50%;
	width: 50%;
	height: 100%;
	position: absolute;
	background:url(../img/common/top_image_bg_l.png) bottom left / 1px 90px repeat-x #FFF;
	z-index: -1;
}
*/
/*
#key_box:after{
	content: '';
	top: 0;
	left: 50%;
	width: 50%;
	height: 100%;
	position: absolute;
	background:url(../img/common/top_image_bg_r.png) bottom right / 1px 90px repeat-x #FFF;
	z-index: -1;
}
*/
#key{
	width: 1100px;
	margin:0 auto;
}

#key .key_sub{
	width: 480px;
	height: 100%;
	box-sizing: border-box;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	position: relative;
}
#key .key_sub .about   { width: 320px; height: 280px;}
#key .key_sub .allfree { width: 150px; height: 180px; margin-left: 300px; margin-top: 50px;}
#key .key_sub .flow 		{ width: 330px; height: 284px;}
#key .key_sub .inquiry { width: 260px; height: 270px; margin-top: -50px;}
#key .key_sub .contact { width: 320px; height: 245px; margin-top: -55px;}
#key .key_sub .privacy { width: 270px; height: 277px; margin-top: -50px;}
#key .key_sub .zeroen{
	position: absolute;
	top : 0;
	left: 0;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
}
#key .key_sub .zeroen_list{
	width: 100px;
	border: 2px solid #f08300;
	border-radius: 10px;
	box-sizing: border-box;
	display: inline-block;
}
#key .key_sub .zeroen_list li{
	padding: 10px 5px;
	text-align: center;
	color: #f08300;
	font-weight: bold;
	font-size: 18px;
	line-height: 1;
}
#key .key_sub .zeroen_list li:nth-child(n+2){
	border-top: 2px solid #f08300;
}
#key .key_sub .zeroen_price{
	color: #f08300;
	line-height: 1;
	font-weight: bold;
	display: inline-block;
}
#key .key_sub .zeroen_price_0{
	font-size: 300px;
}
#key .key_sub .zeroen_price_en{
	margin-left: -50px;
	font-size: 50px;
  text-shadow:
		3px 3px 2px #FFF, -3px -3px 2px #FFF,
		-3px 3px 2px #FFF, 3px -3px 2px #FFF,
		3px 0px 2px #FFF, -3px -0px 2px #FFF,
		0px 3px 2px #FFF, 0px -3px 2px #FFF;
}
#key .key_main{
	width: 620px;
	height: 100%;
	padding-bottom: 80px;
	box-sizing: border-box;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}
#key .key_main .ttl{
	margin-bottom: 10px;
	font-size:40px;
	font-weight: bold;
	letter-spacing:0.1em;	
	line-height: 1;
}
#key .key_main .ttl_subtxt{
	height: 30px;
	margin-bottom: 20px;
	padding: 0 20px;
	line-height: 30px;
	display: inline-block;
	font-size:20px;
	letter-spacing:0.1em;
	color: #FFF;
	background-color: #999;
	/*border: 2px solid #79191d;*/
	/*border-radius: 15px;*/
	box-sizing: border-box;
}
#key .key_main .ttl_name{
	margin-top: 10px;
	display: block;
	font-size: 20px;
	line-height: 1.2;
}
#key .key_main .txt{
	font-size:16px;
	line-height:1.5;
	letter-spacing:0.1em;	
}


/*white_boxS*/
.white_boxS .in_box{
	padding:50px 60px;
	margin-bottom:40px;
	background-color:#FFF;
	/*border-radius: 0 0 30px 30px;*/
	position: relative;
}
.white_boxS .in_box.typeR{
	/*border-radius: 30px;*/
}
.white_boxS .in_box.PTB30{
	padding-top: 20px;
	padding-bottom: 30px;
}


/*ttlS*/
.ttlS{
	width: 100%;
	padding-bottom: 50px;
	position: relative;
}
.ttlS:after{
	content: "▼";
	position: absolute;
	color: #999;
	font-size: 30px;
	font-weight: bold;
	bottom : 0;
	left: 50%;
	transform: translateX(-50%);
	line-height: 1;
}
.ttlS.typCo:after{
	color: #f08200;
}
.ttlS .ttl_sub,
.ttlS .ttl_main{
	width: 100%;
	display: block;
	text-align: center;
	font-weight: bold;
}
.ttlS .ttl_sub {
	font-size: 20px;
	position: relative;
	margin-top: 180px;
}
.ttlS .ttl_sub:before {
	content: "＼";
	margin-right: 5px;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	line-height: 1;
}
.ttlS .ttl_sub:after {
	content: "／";
	margin-left: 5px;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	line-height: 1;
}
.ttlS .ttl_main{
	margin-top: 20px;
	font-size: 30px;
}


/*subttlS*/
.subttlS{
	margin-bottom: 10px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1;
}
.subttlS:before{
	content: "";
	width: 6px;
	height: 1.2em;
	margin-right: 10px;
	display: inline-block;
	vertical-align: bottom;
	/*border-radius: 5px;*/
	background-color: #79191d;
}


/*ttltxtS*/
.ttltxtS{
	margin: 30px 0 50px;
	text-align: center;
	font-size: 18px;
}


/*マーカー*/
.markerS{
	background: linear-gradient(transparent 50%, #fdd000 0%);
	display: inline-block;
	line-height: 1.2;
}


/*リスト*/
.listS li {
	position: relative;
	margin-left: 15px;
}
.listS li + li {
	margin-top: 10px;
}
.listS li:before {
	content: "・";
	position: absolute;
	display: inline-block;
	left: -10px;
	top : 0;
}
.listS.type_count {
	counter-reset: number 0;   
}
.listS.type_count li{
	margin-left: 40px;
}
.listS.type_count li:before {
	counter-increment: number 1;
	content: counter(number) " ";
	left: -31px;
	top : 2px;
}
.listS.type_count li:after {
	content: "";
	width : 25px;
	height: 25px;
	position: absolute;
	left: -40px;
	top : 0;
	display: block;
	line-height: 20px;
	text-align: center;
	border-radius: 50%;
	border: 1px solid #333;
}


/*telS*/
.telS{
	font-size:24px;
	font-weight:bold;
	color:#f08200;
}

	

/*/// footer ///
//////////////////////////////////////////////// */
#footer{
	padding-botom:10px;
	color: #FFF;
	text-align:center;
	font-size:10px;
}
#footer_link,
#footer_copy{
	line-height: 30px;
}
#footer_link { background-color: #695b56;}
#footer_link li { 
	display: inline-block;
}
#footer_link li:before { 
	content: "｜";
	display: inline-block;
}
#footer_link li:last-child:after{ 
	content: "｜";
	display: inline-block;
}
#footer_link li a { 
	color: #FFF;
}
#footer_copy { background-color: #333;}



/*/// その他デザイン ///
//////////////////////////////////////////////// */
.main_W{
	width:1100px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
.minW{
	width:980px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

#bottom{
	width: 100%;
	padding: 50px 0;
	background: #79191d;
}
#bottom_in{
	width: 1100px;
	margin: 0 auto;
}

#bottom_page_info{
	margin-bottom:80px;
	padding: 40px 0;
	background-color: #FFF;
	/*border-radius: 30px;*/
	box-sizing: border-box;
}
#bottom_page_info_L .logo{
	width : 290px;
	height: 100px;
	margin-bottom: 20px;
}
#bottom_page_info_L a{
	display: inline-block;
	margin-right: 20px;
}
#bottom_page_info_L a .logo{
	width: 290px;
	height: inherit;
	margin-bottom: 0;
	vertical-align: middle;
}
#bottom_page_info_R{
	width:660px;
}

#bootom_zenkoku {
	width: 770px;
}
#bootom_zenkoku .ttl {
	font-size: 30px;
	margin-bottom: 20px;
	color: #FFF;
}
#bootom_zenkoku .list_dl {
	font-size: 14px;
}
#bootom_zenkoku .list_dl + .list_dl {
	margin-top: 10px;
}

#bootom_zenkoku .list_dl dt{
	font-weight: bold;
	float: left;
	color: #FFF;
}
#bootom_zenkoku .list_dl dd{
	margin-left: 110px;
}

#bootom_zenkoku .list_ul li { 
	display: inline-block;
}
#bootom_zenkoku .list_ul li:before { 
	content: "｜";
	display: inline-block;
	color: #FFF;
}
#bootom_zenkoku .list_ul li:last-child:after{ 
	content: "｜";
	display: inline-block;
		color: #FFF;
}
#bootom_zenkoku .list_ul a{
	color: #FFF;	
}
#bottom_link_con {
	display: inline-block;
}
#bottom_link_con li{
	margin-left: 20px;
	position: relative;
}
#bottom_link_con li:before{
	content: "▶";
	position: absolute;
	top:0;
	left: -20px;
	color: #FFF;
}
#bottom_link_con > li:nth-child(n+2) {
	margin-top: 10px;
}
#bottom_link_con a{
	color: #FFF;
}



/* 下からふわっと出現（js版） */
.JS_fadein {
  opacity: 0;
  transform: translate(0,0);
  transition: all 1.5s;
}
.JS_fadein.fadein-up{
  transform: translate(0,-30px);
}
.JS_fadein.fadein-bottom{
  transform: translate(0,30px);
}
.JS_fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}


/* 下からふわっと出現（「ホーム」ページのファーストビューにて使用） */
.fadeIn{
animation-name:fadeInAnime;
animation-duration:2.0s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeUp{
animation-name:fadeUpAnime;
animation-duration:1.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
		transform: translate(0,30px);
		transition: all 1.5s;
  }

  to {
    opacity: 1;
	  transform: translate(0, 0);
  }
}


/* 2024.12 */
#key .key_sub .inquiry { width: auto;}
#key .key_sub .flow { width: auto;}
#key .key_sub .allfree { width: auto;}
#key .key_sub .about { width: auto;}












