@charset "utf-8";
/*
Theme Name: Arkhe Child
Theme URI: 
Description: 
Author: 
Author URI: 
Template: arkhe
Version: 9999
*/
/* Child Styles */




/* フォント　*/



html { font-size: 62.5%; }
body { font-size: 1.7rem; }

p,
li,
li p,
th,
td {
	font-size: 1.7rem;
	line-height:1.7em;
	}


body{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}


.B{ font-weight:700; }
.noB{ font-weight:normal; font-weight:500;}

h1,
h2,
h3{
    font-weight:900;
}
h4,
h5,
h6{
    font-weight:700;
}




/*   背景色関連まとめて　*/

.page_title,
#mv,
#cms #cms_idx,
footer{
    /* background: #2799e0; */
    /* background: #25ad4b; */
    /* background: #2C98BE; */
    /* background: #4796d7; */
    /* background: #008ccb; */
    /* background: #B74954; */
   /* background: #4bafd3;*/
    background: #28A255;
}

#point_cms .sub h3{
  color: #28A255;
}

.mv_catch{
 list-style-type: none;
}

.point_list li{  
  color: #000;
}
.point_list li{  }



/*タイトル類*/

h2,h3,h4,h5,h6{}

.page_title{
  color:#FFF;
	margin-bottom:4%;
	text-align:left;
	}
.page_title h1{
  font-size:3.2rem;
  padding:2em 0;
}


h1.page_title,
h2,h3,h4{}

h2{
    color: #1B1B1B;
    text-align:center;
    font-size:4.0rem;
    letter-spacing: 0.1em;
    padding:1em 0;
    margin-bottom:1em;
    display: flex;
    justify-content: center;
    align-items: center;
}
h2.wt{ color: #FFF; }


h3{
	text-align:left;
	padding:0.5em 0;
	margin-bottom:0.5em;
	font-size:2.5rem;
	letter-spacing:0.02em;
	position: relative;
  color:#000;
	}

h4{
    text-align:left;
    background:#F7F7F7;
    padding:1em 1em;
    margin: 1em 0;
    font-size:1.7rem;
    border-radius: 5px; 

}
	
h3.img,
h4.img{ padding:0;}
h5{
	font-size:1.6rem;
	margin-bottom:0.5em;
}
h6{
	font-size:1.5rem;
	border:1px #CCC solid;
	padding:4px;
	color:#000;
	margin-bottom:5px;

}




/* ---------------------------------------------------------------------------
　
　ベースレイアウト

------------------------------------------------------------------------------*/

body{
	text-align:center;
	background:#FFF;
	}

#bg{}
.home #bg{}
	
#container{
	margin:0 auto;
	text-align:left;
	}



/*幅*/
.inner,
.page_title h1,
.sub_navi
{
	width:1200px;
	margin:auto;
	}

#mv .inner{
	width:1200px;
	}
	
/*ヘッダー
--------------------------------------------------------------------------------*/



header{
	width:100%;
	position: fixed;
	top:0;
	left: 0;

	padding:0;
	background: #FFF;
	z-index: 150;
	box-shadow: 0 0px 10px rgba(0,0,0, 0.2);
	
	}
	
/*移動後は、CSSを変更*/
/*
header.header_wt{
}


header .logo_rows{
	padding: 0.5em 1em;
	display:flex;
	justify-content:space-between;
	align-items: center;
	
}
.logo_rows #logo,
.logo_rows #header_navi,
.logo_rows .header_order{
	 margin: auto 0;
}

.logo_rows #logo{ }
.logo_rows #header_navi{ margin-left: auto; margin-right: 2%; }
.logo_rows .header_order{  }

.logo_rows #logo{ width: 250px; padding: 0 1%; }
.logo_rows .header_order{width:120px;}

*/

#logo{}
#logo h1{
	color:#000;
	font-size:13px;
	padding:3px 0px;
	text-align:left;
	}

#logo img{ width:100% }



/* ヘッダーナビ */
#header_navi{
	padding:0;
	}

header nav ul li a:hover{
	text-decoration:none;
	}

#header_navi ul{
	display:flex;
	justify-content: flex-start;
	align-items: center;
	margin:0;
	padding:0;
	}
	

#header_navi ul li{
	margin:0;
	font-weight:bold;

	}
#header_navi ul li a{
	color:#333;
	padding:1.5em 1em;
	text-decoration:none;
	font-size:1.5rem;
	line-height:1.3em;
	position: relative;
	display: block;
	text-align:center;
 	}

#header_navi ul li a:hover{
  color:#C90;
}


#header_navi ul li.btn-em1 a,
#header_navi ul li.btn-em2 a{
	margin:0 5px;
	border-radius: 5px; 
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px;
}


/* svg icon*/
#header_navi ul li a img{
	height:18px; width:auto;
	/*color: #FFFFFF;*/
	margin-right:5px;
	margin-bottom:3px;
	vertical-align:middle;
	}


/*　右側ナビ　*/
.header_order{
	width: 130px;
	}
.header_order ul{
	display:flex;
	justify-content: center;
	align-items: center;
	list-style-type:none;
	}
.header_order ul li{
	width: 100%;
	margin:0;
	margin-right: 1%;
	font-weight:bold;
	}
.header_order ul li a{
	display: block;
	background:#C50707;
	color:#FFF;
  border:2px solid #C50707;
	padding:3% 1%;
	border-radius: 50vh; 
	text-decoration:none;
	font-size:1.4rem;
	text-align:center;
 	}
.header_order ul li a:hover{
  transition: 0.5s ;
	background: #FFF;
	color:#CD3760;
  border:2px solid #C50707;
}

/*　 efecct none */
header nav ul li.navi-em a::after{ height: 0px;}
header nav ul li a:hover::after {}
header nav ul li.on a{	border-bottom:0 ;} 




.information_sps{
	background: #CED6E9;
	clear:both;
	padding:1.2em;
	text-align:center;
}
.information_sps p{
	font-size:1.5rem;
	/*font-weight:bold;*/
	font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho",  serif
	}
	
.information_sps .txt-covid p{
	font-size:1.5rem;
	}
.information_sps .btn-detail{
	margin:5px;
	}
.information_sps .btn-detail a{
	font-size:1.6rem;
	
}


/*フッター*/
/*footer{
	padding: 1em;
}
footer .l-footer__nav li,
footer .l-footer__nav li a{ font-size: 1.3rem; }
footer .c-copyright{
	 font-size: 1.3rem; 
	} */

footer{
	padding:2em;
	text-align:left;
	}
footer *{ color:#FFFFFF;}


footer ul{
	display:flex;
	justify-content: flex-start;
	justify-content:space-around;
	list-style-type: none;
	}

footer ul li{ width:100%; margin-right:3%; }
footer ul li.w_wide{ width:110%; }
footer ul li.w_mini{ width:80%; }

footer ul ul{
	display:block;
	}
	

#foot_logo{}
#foot_addr{
	margin-left:5%;
	text-align:left;
	}	

footer #foot_addr p{
	font-size:1.4rem;
	}
footer #foot_addr p a{
	text-decoration:none;
}

footer nav{}
footer nav ul{}
footer nav ul li{
	text-align:left;

	font-size:1.3rem;
	
}
footer nav ul li a{
	background:url(../images/svg/wt-arrow3.svg) no-repeat 0 center;
	background-size:auto 40%;
	padding-left:13px;

	text-decoration:none;
	margin-left:1em;
	
	
}	
footer nav ul li a:hover{
	text-decoration:underline;
  color: #FFF;
	}	

footer nav ul li.title{}


address{
	clear:both;
	text-align:center;
	font-size:11px;
	padding:30px 0 10px 0;
	font-style:normal;
}


/* フッター固定（お問い合わせボタン） */

.foot-fixed{
    position:fixed;
    bottom:0;
    right:1%;
    text-align:center;
    background:#000;
    z-index:100;
    width:350px;
}

.foot-fixed-navi{}
.foot-fixed-navi ul{
	display:flex;
	justify-content: flex-start;
	align-items: center;

}
.foot-fixed-navi ul li{
	width: 100%;
}
.foot-fixed-navi ul li{
	border-right: 1px solid rgba(255,255,255,0.5);
}
.foot-fixed-navi ul li:last-child{
	border-right:0;
	}
	
.foot-fixed-navi ul li a{
	display: block;
	padding: 0.5em 0.4em 0.3em 0.4em;
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
}

.foot-fixed-navi ul li a:hover{
	text-decoration: underline;
}

.modal-open:hover,
.modal-content .close:hover{	cursor:pointer;	}

.modal-content{
	display:none;
	position:absolute;
	bottom:15px;
	right:40px;
	z-index:150;
	background:#333;
	border-radius: 5px; 
	padding:20px;
	box-shadow:0px 0px 5px #000;
}
.modal-content p{
	color:#FFF;
	font-size:19px;
	text-align:left;

	
}

.modal-title,
.modal-content p.tel{ margin-bottom:10px;} 

.modal-content p.tel a{
	font-family:"Century Gothic", sans-serif;
	font-size:34px;
	color:#FFF;
	text-decoration:none;
	border-bottom:1px solid #FFF;
} 

.foot-contact .img-navigator2{
	position:absolute;
	right:0;
	bottom:0;
	}
.modal-content .close{
	position:absolute;
	top:0px;
	right:10px;
	font-weight:bold;
	color:#FFF;
	text-decoration:none;
	font-size:30px;
	}
	
	
	@media only screen and (max-width:768px){
	

				/*　フッター固定（お問い合わせボタン）*/
				.foot-fixed{
					right:3%;
					width:94%;
				}

				.foot-fixed-navi{
								background:#F8D60F;
								}
				.foot-fixed-navi ul{}
				.foot-fixed-navi ul li{	width: 100%;}
				.foot-fixed-navi ul li{}

				.foot-fixed-navi ul li a{
					padding: 0.8em 0.1em 0.7em 0.1em;
					color: #000;
					font-weight: bold;
					text-decoration: none;

				}
				.foot-fixed-navi ul li a:hover{
					text-decoration: underline;

				}


		}
	

/* コンテンツ ------------------------------------------------------------------------------------*/


#contents{
	padding-top: 80px;
	padding-bottom:50px;
	text-align: left;
	
	}
.home #contents{
	padding-top: 80px;
}

#pan_navi{
	font-size:12px;
	margin:6px 0 6px 0;
	}
	
	

/*  Section */
section{
	clear:both;
	padding:1em 0;
	margin-bottom:3em;
}
section.bg_type{
  padding-top: 2em;
  padding-bottom:3.5em;
}
.entry{ text-align:left; }
	
section.mt0{ margin-top:0; }
section.mb0{ margin-bottom:0; }
section.pt0{ padding-top:0; }
section.pb0{ padding-bottom:0; }


/* 矢印 */
.triangle{
	width: 0;
	height: 0;
	border-left: 49.5vw solid transparent;
	border-right: 49.5vw solid transparent;
	border-top: 15vh solid ;
}

.triangle1{ border-top-color: #D3E3F0;}
.triangle2{ border-top-color: #2697C8;}
.triangle3{ border-top-color: #F6F6F6;}
.triangle4{ }

/* ページ別スタイル */


	
.line{ text-align:center; padding:15px 0;}
.home .line{ text-align:center; padding:0;}






/* */
#contents .eyecatch{
	text-align: center;
	margin-bottom: 20px;
}



.eyecatch{
	margin-bottom: 20px;
}

		
/* その他セレクタ */	

.txt{}
.txt p{
	line-height:1.7em;
	margin-bottom:1.5em;
  
	}
	

/* table */
.entry table{
	border-collapse:collapse;
	}
.entry table th,
.entry table td{
	border-bottom:1px solid #EEEEEE;
	padding:1em 2em;
	line-height:1.7em;	
	}
.entry table th{
	background-color:#F8F8F8;
	text-align:center;
	vertical-align:middle;
}
.entry table td{
	text-align:left;
	}

/**/
.entry .tbl_layout{
	border-collapse:collapse;
	}
.entry .tbl_layout td{
	border-width:0;
	padding:0;
	vertical-align:top;
	}	
	



/*サブナビ*/
.sub_navi{
	margin-bottom:2em;
	}
.sub_navi:after{
	content:"";
	display:block;
	clear:both;
}
.sub_navi ul{
	display:flex;
	justify-content: flex-start;
	list-style-type:none;
	}
.sub_navi ul li{margin-right:5px;}

.sub_navi ul li a{
	display:block;
	font-size:1.7rem;
	font-weight:bold;
	padding:1em 2em;

	color:#333333;
	text-decoration:none;
 
 
	background: #f5f6f6;
	}

.sub_navi ul li a:hover {
	background: #000;
	color:#FFFFFF;
}

.sub_navi ul li.current a{
	background:#999;
	pointer-events:none;
	color:#FFF;
	}


/* 汎用セレクタ */

.bnr{}
.bnr p{ margin-bottom:10px; }

.bnr_type1{}
.bnr_type1 p{ margin-bottom:1em;
	box-shadow: 0 3px 8px rgba(0,0,0, 0.3);
	-moz-box-shadow: 0 3px 8px rgba(0,0,0, 0.3);
	-webkit-box-shadow: 0 3px 8px rgba(0,0,0, 0.3);
	}

.list_no{	list-style-type:decimal;
	margin-left:40px;}
.list_no li{ font-weight:normal;
line-height:1.6em;}


.marker-1{ background: linear-gradient(transparent 60%, #ffff66 60%); }
.marker-2{ background: linear-gradient(transparent 60%, #f27d7d 60%); }

.box_yw{
	border:#FC0 solid 4px;
	color:#F60;
	padding:10px;
	}

.box_pk{
	border:#F9C solid 4px;
	color:#F09;
	padding:10px;
	background:#FFF;
	}

.box_pk h5{
	font-size:18px;
}

.box_pk p{
	margin-bottom:12px;
}

.tm_box1{
  background:#F9F9F9;
  padding: 1.5em;
  margin-bottom: 2em;
}

.txt_bnr1 a,
.txt_bnr_w a{
	display:block;
	color:#FFF;
	font-weight:normal;
	font-size:28px;
	text-align:center;
	line-height:1.2em;
	padding:10px 5px;
	}


.txt_bnr1 a:hover{
	text-decoration:none;
	filter:alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;	

}
.txt_bnr1 a{

	background: #ff0084; /* Old browsers */
	background: -moz-linear-gradient(top,  #ff0084 0%, #d30054 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff0084), color-stop(100%,#d30054)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ff0084 0%,#d30054 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ff0084 0%,#d30054 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ff0084 0%,#d30054 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ff0084 0%,#d30054 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0084', endColorstr='#d30054',GradientType=0 ); /* IE6-9 */

	}
	
	

/*Wide*/
.txt_bnr_w a:hover{
	text-decoration:none;
	filter:alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;	

}
.txt_bnr_w a{
	font-size:26px;
	padding:15px;
	
	background-color:#F60;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #FC0), color-stop(0.00, #F60));
	background: -webkit-linear-gradient(#FC0, #F60);
	background: -moz-linear-gradient(#FC0, #F60);
	background: -o-linear-gradient(#FC0, #F60);
	background: -ms-linear-gradient(#FC0, #F60);
	background: linear-gradient(#FC0, #F60);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FC0', endColorstr='#F60', GradientType=0);
	}





.btn-mini-link{}
.btn-mini-link a{
	border:1px solid #999;
	background:#FFF;
	padding:0px 4px;
	font-size:12px;
	text-decoration:none;
	border-radius: 5px; 
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px;
	color:#333;
}
.btn-mini-link a:hover{
	background:#666;
	color:#FFF;}


.btn-txt{}
.btn-txt a{
	text-decoration: none;
	border-bottom: 2px solid #ED0A0E;
	color: #ED0A0E;
	padding: 2px;
	font-weight: bold;
}
.btn-txt a:hover{
   opacity:0.80;
}




	
.clrfix{
	clear:both;
	zoom:100%;}
.clrfix:after{
    content: "";
    display: block;
    clear: both;
}
.clrfix .f_left{ float:left;}
.clrfix .f_right{ float:right;}

	
.center{text-align:center ;}
.L{ text-align:left ;}
.R{text-align:right ;}

/*テキストセレクタ
-------------------------------------------------------------------------------------*/

.U,
.u{ text-decoration:underline;}


.t9{ font-size:9px;}
.t10{ font-size:70%;}
.t11{ font-size:80%;}
.t12{ font-size:90%;}
.t13{ font-size:100%;}
.t14{ font-size:110%;}
.t16{ font-size:130%;}
.t18{ font-size:160%;}


.t80p{ font-size:80%;}
.t90p{ font-size:90%;}


.t110p{ font-size:110%;}
.t120p{ font-size:120%;}
.t130p{ font-size:130%;}
.t140p{ font-size:140%;}
.t150p{ font-size:150%;}
.t160p{ font-size:160%;}
.t170p{ font-size:170%;}
.t180p{ font-size:180%;}
.t190p{ font-size:190%;}
.t200p{ font-size:200%;}

.tLL{ font-size:180%;}

.tL{ font-size:140%;}
.tLL{ font-size:180%;}
.tS{ font-size:80%;}
.tSS{ font-size:80%;}
.BL{ color:#0A6CBF;}
.RD{ color:#FF0000;}
.RD2{ color:#CC0000;}
.OR{ color:#FF6600;}
.BK{ color:#000000;}
.bg_rd{ background:  #F10609; color: #FFF; }
.bg_yw{ background:  #FFF500; color: #000; }

/*レイアウトセレクタ*/
.wakuRD{border: #FF0000 solid 1px;background-color:#FFFFCC;}
.wakuRD p{ margin:10px;
	}
.bnrimg a:hover img{
	filter:alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;	}
/*ONボタンで透明*/
.bnr_a0:hover img{
	filter:alpha(opacity=0);
	-moz-opacity:0.0;
	opacity:0.0;
}
.mb5{ margin-bottom:5px;}
.mb10{ margin-bottom:10px;}
.mb15{ margin-bottom:15px;}
.mb20{ margin-bottom:20px;}
.mb25{ margin-bottom:25px;}
.mb30{ margin-bottom:30px;}
.mb50{ margin-bottom:50px;}
.mb100{ margin-bottom:100px;}

.mt5{ margin-top:5px;}
.mt10{ margin-top:10px;}
.mt15{ margin-top:15px;}
.mt20{ margin-top:20px;}
.mt25{ margin-top:25px;}
.mt30{ margin-top:30px;}
.mt50{ margin-top:50px;}
.mt100{ margin-top:100px;}


.mgn_b10{	margin-bottom:10px;}
.mgn_t10{	margin-top:10px;}

.mgn_tb10{
	margin-top:10px;
	margin-bottom:10px;
}
.mgn_tb20{
	margin-top:20px;
	margin-bottom:20px;
}


/* flexbox */
.flexbox{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-pack:distribute;
	justify-content: flex-start;
	}
.fbx-wrap{
	flex-wrap: wrap;
	}
.fbx-center,
.flex_cnt{
	  justify-content: center;
	}

.flex_btwn{
	  justify-content: space-between;
	}
.flex_arnd{
	  justify-content: space-around;
	}

/*スマホ用*/
.sp_navi,
.btn_sp_navi,
.sp_only,
#side nav a.menu
{ display:none;}




/*トップページ s*/
#top{}

/* メインビジュアルMV */
#mv{
  /* background: url("../images/top/bg-mv.png") no-repeat center 0;
  background-size: 100% auto; */
  padding: 8% 0;
  margin:2%;
  border-radius: 15px;
  text-align: center;
  
}
#mv *{
    color: #FFF;
}

.mv_catch{
  display: flex;
  justify-content:center;
  align-content: center;
  margin-bottom: 2em;
}
.mv_catch *{ color: #000; }

.mv_catch .mv_catch_txt,
.mv_catch .mv_catch_img{ margin: auto; }

.mv_catch .mv_catch_txt{
	width:60%;
	margin-right:0%;
	}
.mv_catch .mv_catch_img{ width:35%; }
.mv_catch .mv_catch_img img{ width: 100%; }
.mv_catch .mv_catch-1,
.mv_catch .mv_catch-2{
	color:#FFF;
	text-align: center;
}

.mv_catch .mv_catch_1{
	font-size:2.5rem;
  font-weight: bold;
	}


.mv_catch h2{
  font-size:4.2rem;
  line-height:1.4em;
  text-align: center;
  padding:1em 0 0 0;
  margin-left: 1em;
  margin-bottom: 0.7em;
}
.mv_catch h3{
  font-size:3.0rem;
  color: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.3em;
}
.mv_catch h3::after,
.mv_catch h3::before{
  border-top: 3px solid #FFF;
  content: "";
  width: 3em;
}
.mv_catch h3::before{
  margin-right: 1em;
}
.mv_catch h3::after {
  margin-left: 1em;
}



.mv_start_cost,
.mv_month_cost{
    font-weight: 900;
    margin-bottom: 0.4em;
}

.mv_start_cost{
    font-size: 2.2rem;
}
.mv_start_cost .number{
    font-size: 200%;
}
.mv_start_cost .en,
.mv_month_cost .en{
    font-size: 100%;
}
.mv_month_cost{
    font-size: 2.0rem;
}
.mv_month_cost .number{
    font-size: 200%;
}

@media only screen and (max-width:968px){
    
    #mv .inner{
        margin: 0;
        width: 100%;
    }

    .mv_catch{
			flex-wrap: wrap;
    }
    .mv_catch .mv_catch_txt{ width:100%; margin-right:0%; }
    .mv_catch .mv_catch_img{ width:70%; }

    .mv_catch h1{
        font-size:2.8rem;
    }
		.mv_catch .mv_catch_1{
			 font-size:1.8rem;
			 }


    .mv_catch h2{
        font-size:3.3rem;
        padding: 0.3em;
    }
    .mv_catch h3::after,
    .mv_catch h3::before{
			border-top: 3px solid #FFF;
			content: "";
			width: 1em;
    }
    .mv_catch h3::before{
        margin-right: 0.3em;
    }
    .mv_catch h3::after {
        margin-left: 0.3em;
    }

    .mv_start_cost{
        font-size: 1.8rem;
    }
    .mv_start_cost .number{
        font-size: 200%;
    }
    .mv_start_cost .en,
    .mv_month_cost .en{
        font-size: 100%;
    }
    .mv_month_cost{
        font-size: 2.0rem;
    }
    .mv_month_cost .number{
        font-size: 200%;
    }


}
@media only screen and (max-width:414px){

    .mv_catch h1{
        font-size:6vw;
    }
    .mv_catch h3{
        font-size:5.3vw;
    }
}


/*金額部分*/
.top_point-1{
    width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 1em 0;
		list-style-type: none;
}
.top_point-1 li {
    width: auto;
    color:#000;
    text-align: center;
    font-weight:bold;
    font-size:2.3rem;
    position: relative;
    flex-grow: 1;
    margin: 0;
}
.top_point-1 .li_domain{
    flex-basis:100%;
}
.top_point-1 li div{ margin: 0 ; }
.top_point-1 li p{
	font-size:2.3rem !important;
	line-height:1.2em;
}

.top_point-1 li span{
    display: inline-block;
    /*font-size:90%;*/
    line-height:1.2em;
    vertical-align: middle;
}
.top_point-1 li p .number{
    font-family: "Century Gothic", sans-serif;
    font-weight: bold;
    font-size:250%;
    margin:0 5px 0.3em 5px;
	}
.top_point-1 li p .number2{
  font-size:280%;
}
.top_point-1 li p .en {
	font-size:65%;
  font-weight: bold;
	}

.top_point-1 li .note{
    font-size:1.5rem;
    font-weight: normal;
}
.top_point-1 li .kome {	font-size:1.5rem;	}


.top_point-1 .li_domain{}
.top_point-1 .li_domain .icon_domain_free{
  width: auto;
  display: inline-block;
  background: #FFDD00;
  color:#000;
  padding: 0.4em 1.5em;
  border-radius: 50vh; 
	font-size: 1.7rem;
}







/* TOPテキスト入りナビ（共用可）*/
.list-overview{
  margin: 1em 0;
  justify-content: center;
}
.list-overview li{
  width: 100%;
  margin: 1%;
  padding: 3%;
  text-align: center;
  display: flex;
  flex-direction: column;
  border: 1px solid #CCC;
  
}
.list-overview li p{
  margin-bottom: 1em;
}
.list-overview li p.icon{}
.list-overview li p.text{ text-align: left;}
.list-overview li .btn-detail_mini {
  margin-top: auto;
  
}
.list-overview li .btn-detail_mini a{
  width:100%;
}

@media only screen and (max-width:768px){

    .list-overview{
        flex-wrap: wrap; 
    }
    .list-overview .icon img{
        width: 30%;
        min-width: 150px;
    }
}

/*TOPツール特長*/
#top_cms{}

/* 特長リスト（枠）サービス特長・ツール特長共用 */
.point_list{
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 2% 5%;
  margin-bottom: 2em;
}

.point_list li{  
  /*border:3px solid #FFF;*/
  background: #FFF;
	box-shadow: 0 1px 7px rgba(0,0,0, 0.2);

  flex-basis: 32%;
  margin-bottom: 2%;
  text-align: center;
  vertical-align:middle;
  
  font-size:2.7rem;
  font-weight: bold;
  line-height: 1.2em;
  padding: 1em 0;
  border-radius: 7px; 
  
  display: flex;
  justify-content: center;
  
}
.point_list li span{
  display:block;
  font-size: 80%;
  line-height: 1.5em;
}
.point_list li .icon{
  margin-bottom: 10px;
  height: 40px;
}

/* HPに含まれているもの用　*/
#package .pic{ width: 35%;}
#package .pic img{ width: 100%;}
#package .point_list{ width: 60%;}
#package .point_list li{
  background:rgba(249,249,249,1.00);
  color: #333;
	box-shadow: 0 1px 7px rgba(0,0,0, 0.2);
  /*font-size: 1.8rem;*/
}
#package .point_list span{
  display:block;
  margin: auto;
  font-size: 60%; 
}


.txt_self{
  border: 2px solid #000;
  background: #F9F9F9;
  padding: 1em;
  text-align:center;
}
.txt_self p{
  font-weight: bold;
}


.memo{
  padding: 1em 1.5em;
  margin-bottom: 2em;
  border: solid 2px #4491D8;
 /* background: rgba(200,200,200, 0.1);
	box-shadow: 0 2px 7px rgba(0,0,0, 0.2);*/
 
}
.memo *{
  color: #4491D8 ;
}
.memo h3{ font-size: 2.0rem; }
.memo p{ font-size: 1.4rem; }




/* プラン（複数ページで使用）*/
#plan{}
.price_pickup{
  justify-content: center;
  align-content: center;
  margin-bottom: 1em;
	list-style-type: none;
}
#plan_pickup .pic{
	margin-bottom: 1em;
	}

.price_pickup li{
  width:96%;
  background: #FFF;
  margin: auto 0;
  text-align: center;
  font-weight: bold;
 
}
.price_pickup h3{
  color:#F10404;
  font-size: 2.3rem;
  padding: 0;
  margin-bottom:0.5em;
}
.price_pickup .price{}
.price_pickup .price h3{ text-align: center; }
.price_pickup .price_start,
.price_pickup .price_month{
  border: 5px solid #F10404;
  padding: 3em 0.5em;
}
.price_pickup .price_start .number{ font-size:3.0rem; }
.price_pickup .price_month .number{ font-size:2.4rem; }

.price_pickup .number span{ font-size:200%; /* 数値部分 */ }
.price_pickup .number2{ font-size: 2.5rem; margin-left: 1.5em;}
.price_pickup .unit{ font-size:80%; }
.price_pickup .icon_plus{
  width: 20%;
  
}

.price_pickup .number{
  color: #F10404;
  font-size: 3.0rem;
}




/*　含まれる機能　*/
.plan_function{
  flex-wrap: wrap;
  justify-content: space-between;
	list-style-type: none;
  
}
.plan_function li{
  flex-basis: 24%;
  margin-bottom: 2%;
  padding-bottom:2%;
  text-align: center;
  
  border: 5px solid #F1F1F1;
  border-radius:10px;
}
.plan_function li h4{
  font-weight: bold;
  text-align: center;
  background: #F1F1F1;
  margin: 0;
  margin-bottom: 1em;
  padding: 0.5em;
  border-radius: 5px 5px 0 0;

}
.plan_function li p{ font-weight: bold; }

.plan_function .kome{
  font-size: 80%;
}


/*　構成例　*/
.box_composi_example{
  width: 50%;
  border: solid 2px #2A95D4;
  margin: 2em auto 1em auto;
  text-align: center;
  position:relative;
}
.box_composi_example h4{
  position:relative;
  display: inline-block;
  padding: 0 10px 10px 10px;
  color: #2A95D4;
  background: #FFF;
  text-align:center;
  font-size:2.3rem;
  top:-0.6em;
}
.box_composi_example ul{
  list-style-type: disc;
  margin:0em 3em 2em 3em;
}
.box_composi_example ul li{
  color: #2A95D4;
  font-weight: bold;
  text-align:left;
  font-size: 2.0rem;

}

.option_page_add{
  display: inline-block;
  border: solid 2px #45A7E0;
  color: #45A7E0;
  padding: 0.5em 2.0em;
  border-radius: 50vh;
  font-weight: bold;
}



.notes{
    padding: 1em; 
}
.notes ul li{
  line-height: 1.5em;
  margin-bottom: 0.5em;
}

.notes_caution{
	background: #F9F9F9;
	padding: 1em;
	font-size: 90%;
}
.notes_caution ul{
  list-style-type: none;
}

.notes_caution_strong{
	padding: 1em;
	font-size: 90%;
	border:3px solid #E30003;
	border-radius: 5px;
	font-weight: bold;

}
.notes_caution_strong ul{
	list-style-type: none;
	margin: 0;
}
.notes_caution_strong ul li{
	color:#E30003;
  font-size:1.8rem;
    
}

/*  お申込みに関する注意　*/
#contact_caution{	margin: 3%; }
#contact_caution p{
	font-weight: bold;
	font-size: 1.8rem;
}
.contact_caution_list{
	/*border:solid #E91518 5px;*/
	border:solid #ccc 5px;
	border-radius: 15px; 
  margin: 1em;
  padding: 0.5em  2em;
}
.contact_caution_list ul{
	list-style-type: disc;
	margin: 1em 2em;
}
.contact_caution_list ul li{
	
	/*
  color: #E91518;
	font-weight: bold;
  font-size: 1.8rem;*/
  margin-bottom: 0.5em;
}

#domain{}



/* 選ばれる理由　*/
#service{}
.feature_list{}
.feature_list h3{
  font-size: 3.0rem;
  text-align: left;
}
.feature_list .sub{
  margin-bottom: 4em;
  padding:1em 0 1em 0;
}
.feature_list .sub:last-child{
   margin-bottom: 0em;
}

.feature_list .sub{
	display: flex;
	justify-content: space-around;
	align-content:flex-start;
}
.feature_list .sub .txt{ width: 58%; margin: 0; }
.feature_list .sub .pic{ width: 32%; margin: 0; }
.feature_list .sub .pic img{
  width:100%;
  border-radius: 10px;
}
.feature_list .sub h3{  }

.feature_list .sub .txt{ order: 2; }
.feature_list .sub .pic{ order: 1; }

/*.feature_list .sub:nth-child(2n) .txt{ order: 2; }
.feature_list .sub:nth-child(2n) .pic{ order: 1; }*/



#package.bg_type{
  background: #EBEBEB;
}



.merit-idx{
	padding: 2em;
	margin-bottom:0.5em;
	}


.merit-idx{}
.merit-idx ul{
	list-style-type:none;
	
	display:flex;
	flex-wrap: wrap;
	justify-content: space-around;
 	align-items: stretch;

	margin:0;

	}
.merit-idx ul li{
	display: flex;
	flex-direction: column;
  
  
	width:32%;
	padding:0 1%;
	margin-bottom:1%;
	
	text-align:center;
  
  background:rgba(255,255,255, 0.10);
  color: #FFF;
	
	}
.merit-icon{}

.merit-idx ul li h3{
	text-align:center;
	padding:0.5em;
	color: #FFF;
	border: 0;
	
}
.merit-idx ul li .txt{
	text-align:left;
	margin: 0;
	padding:0.5em;
	padding-bottom: 0;
	}

.merit-idx ul li .btn-detail{
	margin-top: auto;
	margin-bottom: 2em;
	}



/* ツールの特長　*/
#cms{}
#cms #cms_idx h2{ color: #FFF; }
#point_cms{}
#point_cms .sub{
	background:#F8F8F8;
	padding:2em 0 3em 0 ;
  margin-bottom:0;
	
}
#point_cms .sub .inner{
	display:flex;
	justify-content:space-between;
	align-items: flex-start;
  flex-wrap:wrap;
  background:#F8F8F8;
}
#point_cms .sub h3{
  flex-basis: 100%;
  text-align: center;
  margin-bottom: 1em;
	}

#point_cms .sub .txt,
#point_cms .sub .pic{
  margin: 0;
}

#point_cms .sub .txt{
	flex-basis: 50%;
  order: 2;
}
#point_cms .sub .pic{
	flex-basis: 45%;
  order: 1;
}
#point_cms .sub .pic img{
  width: 100%;
  border: 10px solid rgba(215,215,215,0.10);
}


/*
.point-navi{
	background:inherit;
	margin-bottom:1.5em;
}
.point-navi:after{
	content:"";
	display:block;
	clear:both;
}	
.point-navi{
	list-style-type:none;
}
.point-navi li {
	float:left;
	display:inline-block;
	color:#000;
	margin:0 10px 10px  0;
	font-size:18px;
	
}
.point-navi li a{
	border:1px solid #000;
	display:block;
	padding:5px 25px;
	color:#000;
	background:#FFF;
	text-decoration:none;
	}
.point-navi li a:hover{
	background:#CCC;
}*/

#omakase{}





#top_catch{}

#top_catch .inner{
	background:#000;
	text-align:left;
	padding:2em 0;
	
	border:1px solid #FFF;
	
	box-shadow: 0 3px 8px rgba(0,0,0, 0.3);
	-moz-box-shadow: 0 3px 8px rgba(0,0,0, 0.3);
	-webkit-box-shadow: 0 3px 8px rgba(0,0,0, 0.3);
	}	
#top_catch .catch_txt{
	margin:0;
	margin-left:2em;
  	
	}
#top_catch .pic{
	margin:0;
	margin-left:2em;
	margin-right:2em;
}

#top_catch .catch_txt p{
	color:#FFF;

	}
#top_catch .catch_txt p.catch_txt_1{
	color:#FC0;
	font-size:2.4rem;
	line-height:1.3em;
	text-align:center;
	margin-bottom:10px;
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho",serif; 
	}

#top_catch .catch_txt p.catch_txt_2{
	background:#222222;
	padding:1.3em;
}



#top_case{}
#top_case .flexbox{
	justify-content:space-between;
	}
#top_case .check_list,
#top_case .pic{ margin:0; }

#top_case .check_list{
	width:100%;
	margin-right:1em;
	}
#top_case .check_list ul{
	list-style-type:none;
	}
#top_case .check_list ul li{
	background:url(../images/common/icon-check.png) no-repeat 0 center;
	background-size:auto 24px;
	margin-bottom:15px;
	border-bottom:1px solid #C00;
	text-align:left;
	color:#000;
	font-weight:bold;
	font-size:1.8rem;
	padding:7px 7px 7px 35px;
}


	
/* --------------------------------------------------------------

 Ｑ＆Ａ

----------------------------------------------------------------*/


#faq{}

.faq_list h3{
	font-size:2.0rem;
  text-align: left;
	position:relative;
	}
.faq_list h3:hover{
	cursor:pointer;
}
.faq_list h3:before {
	content: "Q.";
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	margin-right:10px; 
	font-size:110%;
}

.faq_list h3:after{
	}

.faq_list .answer{
	padding:5px 20px 30px 35px;
	position:relative;
	}
.faq_list .answer p{
	line-height:1.6em;
	margin-bottom:0.5em;
}
.faq_list .answer:before {
	content: "A.";

	position:absolute;
	top:10px;
	left:10px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	margin-right:10px; 
	font-size:100%;

}

/*アイコン*/
.faq_sub .i_box{
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;

	top:25%;
	right: 5%;
	margin-top: 0px;

	border-radius: 50%; 
	-webkit-border-radius: 50%; 
	-moz-border-radius:  50%; 
	
	width: 38px;
	height: 38px;

	box-sizing: border-box;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
}
.faq_sub .i_box .one_i {
 
  display: block;
  width: 22px;
  height: 22px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
  position: relative;
}
.faq_sub .open .i_box{
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
}
.faq_sub .i_box .one_i:before,
.faq_sub .i_box .one_i:after {
  display: flex;
  content: '';
	background-color:rgba(0,0,0, 1);
	width: 22px;
	height:2px;
	position: absolute;
	top: 10px;
	left: 0;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	transform-origin: center center;
}
.faq_sub .i_box .one_i:before {
	width: 2px;
	height: 22px;
	top: 0;
	left:  10px;
}
.faq_sub .open .i_box .one_i:before {
content: none;
}
.faq_sub .open .i_box .one_i:after {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}




/* ---------------------------------------------------------------------------

流れ

------------------------------------------------------------------------------*/




#flow{ background:#FBFBFB;
	padding:1em;
	}
#flow .sub{
	/*border:1px solid #EEE;
	margin-bottom:1.5em;
	background:#FFF;
	padding:2em;*/
  border-bottom:1px solid #EEE;
	margin-bottom:1.5em;
	background:#FFF;
	padding:2em;
}
#flow h2{
  text-align:left;
   border-bottom:1px solid #EEE;
}
#flow .sub:last-child{
  margin-bottom:0;
}
#flow .sub h3{
	margin-top:0;
}

#flow h3 span{
  color:#FFF;
  font-weight:normal;
	
	margin-right:5px; 
}
#flow h3 span.step{
 font-size: 70%;
  background:#86ACCC;
	vertical-align:1%;
  padding:0 5px 1px 5px;
	}
#flow h3 span.charge{
  font-size: 45%;
  background: #299F4C;
	vertical-align:0;
  padding:4px 5px 5px 5px;
}
#flow h3 span.charge2{
  background: #B76E10;
}
.tab_navi{}
.tab_navi ul{
  display:flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 0;
}
.tab_navi ul li{
  display:inline-block;
  padding: 1em 2em;
  background: #FFF;
  margin-right: 10px;
  border:solid #EEE;
  border-width: 1px 1px 0 1px; 
}
.tab_navi ul li:hover{
  cursor:pointer;
}
.tab_navi ul li:hover,
.tab_navi ul li.active{
  background:#EBEBEB;
}

.tab_content{
  background: #FFF;
  border:1px solid #EEE;
}
.tab_content .tab_sub{
  display:none;
}

.tab_content .tab_sub.active{
  display:block;
}




/* ---------------------------------------------------------------------------

　　デモサイト

------------------------------------------------------------------------------*/

#demosite{}
#demosite .flexbox{
  justify-content: space-between;
  align-content: center;
}
#demosite .flexbox .sub{
}
#demosite .left{ margin-right: 3%;}
#demosite .right{}

#hp_image{}

#hp_image .flexbox{
	align-items:flex-start;
	justify-content: flex-start;
	margin-bottom:1em;
	flex-wrap: wrap;
	
	list-style-type: none;
}
#hp_image .flexbox li{
	width: 31%;
	margin-right: 1%;
	margin-bottom: 1%;
	border: 1px solid #DDD;
	padding: 1%;
}
#hp_image .flexbox li img{ width: 100%; }
#hp_image h3{
	font-size: 2rem;
	text-align: center;
	padding: 5px;
	border-top: 0;
}


/* 会社 */


#company{}


#company .company_sub{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-pack:distribute;
	
	align-items:flex-start;
	justify-content: flex-start;
/*	justify-content:space-between;*/

	margin-bottom:2em;
}


#company .company_sub .pic,
#company .company_sub .detail{
	margin-top:0;}

#company .company_sub .pic{ width:40%; }
#company .company_sub .pic img{width:100%; }
#company .company_sub .detail{ width:56%; }
#company .company_sub .detail table{ width:100%; }




/*　NEWS（INFORMATION）*/


#information{}
#information ul{
	list-style-type:none;
	margin:0;
	}
#information ul li{
	padding: 0.5rem 0;
	margin-top: 0.5em;   border-bottom: 1px dotted #c8c8c8;
}
#information a{
  color:#383838;
  }


#information .left ul li{/* display:flex;*/ }
#information span{
  display:inline-block;
  vertical-align:top;
  padding:0;
  } 
#information .date{
  font-size:1.3rem;
}
#information .icon_cate{
  background:#E7E7E7;
  padding:1px 0;
  font-size:11px;
  text-align:center;
  }
 
#information span{ width:58%; margin-right:1%;}
#information span.date{  width:12%;}
#information span.icon_cate{  width:18%;}

#information .left{
  width:70%;
  }
#information .right{
  width:30%;
  }
#information a{ text-decoration: none; }



/*ご利用規約・プライバシーポリシー*/
#terms,
#privacy{}

#terms h2,
#privacy h2{
	text-align: left;
	font-size: 2.0rem;
	padding: 0;
	
	}
#terms .post ul,
#terms .post ol,
#privacy .post ul,
#privacy .post ol{
	margin-bottom:2em;
}
#terms .post p,
#privacy .post p{
	margin-bottom:1em;
}
  
/* プライバシーポリシー */
/*
#privacy{
	text-align:left;
	}

#privacy ol{ list-style-type:decimal;
  margin-left:20px;
}

#privacy .txt{
	margin-bottom:2em;
	}

#privacy .txt_sign{
	float:right;
	text-align:left;
	}
#privacy .txt_sign_box{
	border:1px solid #CCC;
	padding:1.5em 1.5em 0 1.5em;
	}
*/




/* リンク */


#link{ text-align: left; }
#link ul{
    list-style-type: disc;
margin-left: 1em;}

/* その他共通 */


.tbl-simple{
  margin-bottom: 10px;
}
.tbl-simple th,
.tbl-simple td{
	padding: 1em;
	border: 1px solid #EEE;
}

.tbl-simple th{
	background:#F7F7F7;
}
.tbl-simple td{}

.post ol{
  margin-left: 1em;
  margin-bottom: 1em;
}
.post ol li{
  margin-bottom: 0.4em;
  line-height: 1.5em;
}
.post ul{
	list-style-type: disc;
	margin-left: 2em;
	margin-bottom: 0.5em;
}

.post ul li{
	margin-bottom: 0.3em;
}
.post ul{}



.list_simple{
  margin-left: 2em;
  margin-bottom: 1em;
  list-style-type: disc;
  
}
.list_simple li{
  margin-bottom: 0.3em;
}
.list_simple{}

.btn{}
.btn a:hover{ transition: 0.3s ; }

.btn-detail{
	text-align:center;
	}
.btn-detail a{
  background: url("../images/common/icon-btn.png") no-repeat 0 center;
  background-size: auto 26px;
	display:inline-block;
	font-weight:bold;
	text-decoration:none;
	color: #000;
	/*border-bottom:#000 solid 2px;*/
	padding:5px 5px 5px 30px;
}
.btn-detail a:hover{
	color:#000;
	/*border-bottom:#FFD600 solid 2px;*/
   opacity:0.60;
		 
}
.btn-detail-wt{}
.btn-detail-wt a{
  background: url("../images/common/icon-btn-wt.png") no-repeat 0 center;
	color: #FFF;
}
.btn-detail-wt a:hover{
	color:#FFF;
}



/* btn ver2  （ラウンド型・黒背景）*/
.btn-detail2{
	text-align:center;
	}
.btn-detail2 a{
	display:inline-block;
	font-weight:bold;
	text-decoration:none;
	background:#1B1B1B;
  color:#FFF;  
	border:#1B1B1B solid 2px;
	padding:0.8em 2em;
	text-decoration:none;
	border-radius:50vh;
  font-size: 1.8rem;
}
.btn-detail2 a:hover{
  color: #1B1B1B;
	background:#FFF;
}



/* btn ver3  （ラウンド型・赤背景）*/
.btn-detail3{
	text-align:center;
	}
.btn-detail3 a{
	display:inline-block;
	font-weight:bold;
	text-decoration:none;

  color:#FFF;
	background: #CD3760 ;
	border:#CD3760 solid 2px;  
/*	background: #0DA4E3;
	border:#0DA4E3 solid 2px;*/
  
	padding:0.6em 2em;
	text-decoration:none;
	border-radius:50vh;
  
  font-size: 2.0rem;
  
}
.btn-detail3 a:hover{
/*	color: #0DA4E3;*/
	color: #CD3760;
	background:#FFF;
}


/* btn ver_mini  （ラウンド型・小）*/
.btn-detail_mini{
	text-align:center;
	}
.btn-detail_mini a{
	display:inline-block;
	font-weight:bold;
	text-decoration:none;
	/*background:#1B1B1B;
  color:#FFF;  
	border:#1B1B1B solid 2px;*/
  
  background:#FFF;
  color:#1B1B1B;  
	border:#1B1B1B solid 2px;
  
	padding:0.4em 1.5em;
	text-decoration:none;
	border-radius:50vh;
  font-size: 1.5rem;
}
.btn-detail_mini a:hover{
  color: #FFF;
	background:#1B1B1B;
}


/* btn order*/

.btn-order{
	text-align:center;
	}
.btn-order a{
	display:inline-block;
	font-weight:bold;
	text-decoration:none;
	
	color:#FFF;
	border:#FF5151 solid 2px;
	background: #FF5151;
	padding:1em 2.5em;
	text-decoration:none;
	border-radius:50vh; 
	font-size: 2.0rem;
}
.btn-order a:hover{
	color: #FF5151;
	background:#FFF;

}


.box_youtube{
	width:1000px;
}
@media screen and (max-width: 768px) {
  .box_youtube{
    position: relative;
    width: 100%;
    padding: calc(315 / 560 * 100%) 0 0;
  }
  .box_youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}




.txt_campaign{
	padding: 0 0 1em 0;
}
.txt_campaign p{
	text-align: center;
	font-weight: bold;
	color: #FF0004;
	font-size: 1.8rem;
}



@media only screen and (max-width:768px){

		*{box-sizing: border-box;}
		
		body{}

						
		body{
			text-align:center;
			background:url(../img/common/bg.png) ;
			position:static;
			}
		
		#bg{
			background:none;
			}
		
		
		/*表示・非表示*/
		.sp_none{ display:none !important;}
		.sp_only{ display:block;}
		
		
		body,
		#container,
		.content{ padding:0 !important; margin:0 !important;}
		
		#container{
		overflow: hidden;
		}
		
		
		#head_menu{ display:none;}
		
		
		/*幅関係*/
 
		.inner,
		.page_title h1,
		#header_navi .inner,
		.sub_navi
		/*#mv .inner*/
		{
			width:94% ;
			margin:0 3%;
			}


		img{ width:100%; height:auto;}
		
		
		.sp_on{display:block;}	
		
		
		
		
		/* ヘッダー */
		

		  
		  header{
			  width:100%;
			  padding-bottom: 2%;
			  }


			header .logo_rows{
				padding:1%;
			}


			
			.logo_rows #logo{ width:50%; }
			.logo_rows .header_order{ display: none; }
			.logo_rows #logo img{ width:180px; }
		  

		/* ナビ（共通）*/
		#header_navi{	display: none;		}
		
		  
		  /* 緊急のお知らせ　*/
		  .information_sps{
			  padding:0.5em 0.2em;
			  text-align:center;
		  }
		  .information_sps p{
			  font-size:1.3rem;
			  font-weight:normal;
			  }
			  
		  .information_sps .txt-covid p{
			  font-size:1.2rem;
			  }
		  .information_sps .txt-covid p br{
			  display:none;
		  }

		  .information_sps .btn-detail{
			  margin:5px;
			  }
		  .information_sps .btn-detail a{
			  font-size:1.2rem;
		  }
		 

		
		
	


		
	


		
		
		/* オフセットfixed対策　*/
		#contents{
			padding-top: 60px;
		}
		.home #contents{
			padding-top: 10%;
		}		
		
	
		section{}

		
		/* タイトル */

		.page_title h1{
			font-size:7vw;
			text-align:center;}
		
		h2{ font-size:7vw; }
		h3{ font-size:5vw; }
		

		
		/* 汎用／共通 */
		.entry table{}
		.entry table.tbl-sp-blk{}
		.entry table.tbl-sp-blk th,
		.entry table.tbl-sp-blk td{
			display:block;
			}
		
		.triangle{
			width: 0;
			height: 0;
			border-left: 49.5vw solid transparent;
			border-right: 49.5vw solid transparent;
			border-top-width: 5vh  ;

		}

  

    /* btn ver2*/
    .btn-detail2{}
    .btn-detail2 a{
      display: block;
      padding:0.5em;
      margin-left: 1em;
      margin-right: 1em;
      font-size: 5vw;

    }

    /* btn ver3 */
    .btn-detail3{}
    .btn-detail3 a{
      display: block;
      padding:0.5em;
      margin-left: 1em;
      margin-right: 1em;
      
      font-size: 5vw;
    }

    /* btn order*/
    .btn-order{
      text-align:center;
      }
    .btn-order a{
      display:inline-block;
      font-weight:bold;
      text-decoration:none;

      color:#FFF;
      border:#FF5151 solid 2px;
      background: #FF5151;
      padding:0.2em 2.5em;
      text-decoration:none;
      border-radius:50vh; 
      font-size: 2.0rem;
    }
    .btn-order a:hover{
      color: #FF5151;
      background:#FFF;

    }



		.btn-order{
			margin-left: 10%;
			margin-right: 10%;
		}.btn-order a{
			width: 100%;
			padding:0.3em 0em;
			font-size:1.8rem;

		}


		
		/*サブナビ*/
		.sub_navi{}
		.sub_navi ul{
			flex-wrap: wrap;
			}
		.sub_navi ul li{ margin-right:5px; margin-bottom:1em;}
		
		.sub_navi ul li a{
			font-size:3vw;
			padding:1em 1em;
			}
		
		.sub_navi ul li a:hover {
		}
		
		.sub_navi ul li.current a{
			}

		
		
    /* TOP */
  
    .top_point-1{
      }

    .top_point-1 li {

    }
    .top_point-1 li:nth-child(1):after{
    }
    .top_point-1 li div{ margin: 0 ; }
    .top_point-1 li p{
      font-size:1.7rem;
      line-height:1.2em;
    }

    .top_point-1 li span {}
    .top_point-1 li p .number{font-size:290%;}
    .top_point-1 li p .number2{font-size:250%;}
  
    .top_point-1 li p .en {}
    .top_point-1 li .note{}
    .top_point-1 li .kome {}
    .top_point-1 .li_domain{ }

   

    .point_list{ margin: 2% 1%;  }
    .point_list li{  
      flex-basis: 49%;
      font-size:5vw;
      line-height: 1.2em;
      padding: 1em 0.2em;

    }
    .point_list li span{    }



    /* HPに含まれているもの用　*/
    #package .flexbox{
      flex-wrap: wrap;
    }
    #package .pic{ width: 100%; text-align: center; }
    #package .pic img{ width: 50%;}
    #package .point_list{ width: 100%;}
    #package .point_list li{
      background:rgba(249,249,249,1.00);
      color: #333;
      box-shadow: 0 1px 7px rgba(0,0,0, 0.2);
    }
    #package .point_list span{
      display:block;
      margin: auto;
      font-size: 60%; 
    }


    /*つくれるウェブの特長*/
    #service{}

    .feature_list{}
    .feature_list h3{}
    .feature_list .sub{
      margin-bottom: 2em;
      padding:1em 0 1em 0;
    }

    .feature_list .sub{
      flex-wrap: wrap;
  }
    .feature_list .sub .txt{ width: 96%; margin: 0 2% 0 2%; }
    .feature_list .sub .pic{ width: 100%; margin: 0; }
    .feature_list .sub .pic img{}
    .feature_list .sub h3{ font-size: 6vw; text-align: center; }

    .feature_list .sub:nth-child(2n) .txt{ order: 1; }
    .feature_list .sub:nth-child(2n) .pic{ order: 2; }

    #top_package{
      background: #EBEBEB;
    }
  
    /*　HPに含まれているもの　*/
    #top_package .flexbox{
      flex-wrap: wrap;
    }
    #top_package .flexbox div{ text-align:center; margin-bottom: 1em; }
    #top_package .flexbox img{ width: 60%; }
    #top_package .point_list li{}
    #top_package .point_list span{
      font-size: 4vw; 
    }
    .txt_self{
      padding: 0.5em;
    }
    .txt_self p{
      font-size: 4vw;
    }

		/*新着*/
		#information{}
		#information ul{
			}
		#information ul li{
			padding: 0.5rem 0;
			margin-top: 0.5em;   border-bottom: 1px dotted #c8c8c8;
		}
		#information a{
			color:#383838;
			}


		#information .left ul li{}
		#information span{
			display:inline-block;
			vertical-align:top;
			padding:0;
			} 
		#information .date{
			display: block;	
		}
		#information .icon_cate{
			background:#E7E7E7;
			padding:1px 0;
			font-size:11px;
			text-align:center;
			}

		#information span{ width:100%; margin-right:1%;}
		#information span.date{  width:12%;}
		#information span.icon_cate{  width:18%;}

		#information .left{
			width:70%;
			}
		#information .right{
			width:30%;
			}
		#information .title{
			font-size: 1.7rem;
			}

		/* プラン（複数ページで使用）*/
		#plan{}
		#plan_pickup{}
    .price_pickup{
      flex-wrap: wrap;
      margin-bottom: 1em;
    }
    .price_pickup li{
      width:96%;
    }
    .price_pickup h3{}
    .price_pickup .price{}
    .price_pickup .price h3{ }
    .price_pickup .price_start,
    .price_pickup .price_month{}
    .price_pickup .price_start .number{ font-size:6vw; }
    .price_pickup .price_month .number{ font-size:5vw; }

    .price_pickup .number span{}
    .price_pickup .number2{}
    .price_pickup .unit{}
    .price_pickup .icon_plus{
      width: 20%;
      padding: 5%;
    }



		.notes{
				padding: 1em; 
		}
		.notes ul li{
			line-height: 1.5em;
			margin-bottom: 0.5em;
			font-size: 95%;
		}

		.notes_caution ul{
			list-style-type: none;
		}



    .price_pickup{
      font-size: 5.7vw;
    }


    /**/
    .plan_function{}
    .plan_function li{
      flex-basis: 32%;
    }
    .plan_function li h4{font-size: 3.0vw; padding: 5px; }
    .plan_function li p{font-size:4.3vw;}
    .plan_function .kome{ }

  .plan_function li img{
    width: 26px;
    
  }
  


    /*　構成例　*/
    .box_composi_example{
      width: 100%;
    }
    .box_composi_example h4{
      padding:10px;
    }
    .box_composi_example ul{
      margin:0em 2.5em 2em 2.5em;
    }
    .box_composi_example ul li{
      font-size: 5vw;
    }

    .option_page_add{
      display: inline-block;
      border: solid 2px #45A7E0;
      color: #45A7E0;
      padding: 0.5em 2.0em;
      border-radius: 50vh;
      font-weight: bold;
    }



    /* ツールの特長　*/
    #point_cms{}
    #point_cms .sub{
      background:#F8F8F8;
      padding:2em 0 3em 0 ;
      margin-bottom:0;

    }
    #point_cms .sub .inner{
      display:flex;
      flex-wrap:wrap;
    }
    #point_cms .sub h3{
      flex-basis: 100%;
      /*font-size: 2.5rem;*/
      }

    #point_cms .sub .txt,
    #point_cms .sub .pic{
      flex-basis: 100%;
    }
    #point_cms .sub .txt{}
    #point_cms .sub .pic{}
    #point_cms .sub .pic img{}


		/*特長*/
		#merit{}


  .merit-idx{
    background: #24AFB9;
    padding: 0 2%;
    margin-bottom:0.5em;
    }


  .merit-idx{}
  .merit-idx ul{}
  .merit-idx ul li{
    width:100%;
    padding:0 1%;
    margin-bottom:1%;
  /*	background:#F3EBEF;*/
    text-align:center;

    }
  .merit-icon img{ width: 40%; }

  .merit-idx ul li h3{
    text-align:center;
    padding:0.5em;
    color: #FFF;
    border: 0;

  }
  .merit-idx ul li .txt{
    text-align:left;
    margin: 0;
    padding:0.5em;
    padding-bottom: 0;
    }

  .merit-idx ul li .btn-detail{
    margin-top: auto;
    margin-bottom: 2em;
    }

  #point{}
  
  #point .sub h3{
    text-align:center;
    font-size: 5vw;
	}  
  #point .sub .txt{
    flex-basis:  100%;
  }
  #point .sub .pic{
    flex-basis:  100%;
  }
  #point .sub .pic img{

  }


		/* デモサイト */
		#hp_image{}

		#hp_image .flexbox{
			margin-bottom:1em;
		}
		#hp_image .flexbox li{
			width: 96%;
			margin:0 2% 2% 2%;
			padding: 2%;
		}
		#hp_image .flexbox li img{}
		#hp_image h3{}


		#demosite{}
		#demosite .flexbox{	display: block;}

		#demosite .flexbox .left{ text-align: center; }
		#demosite .flexbox .left img{ width: 70%; }

		#demosite .flexbox .right{}
		#demosite .flexbox .right table{ width: 100%; }

				
			/*　Ｑ＆Ａ　*/
			
			
			#faq{}
			
			.faq_list{}
			.faq_list h3{
				font-size:3.6vw;
				padding-right:10%;
				text-align:left;
				}
			.faq_list h3:hover{
			}
			.faq_list h3:before {
				font-size:100%;
			
			}
			
			.faq_list h3:after{
				}
			
			.faq_list .answer{

				}
			.faq_list .answer p{

			}
			.faq_list .answer:before {
				font-size:100%;
			
			}
			
			/*アイコン*/
			.faq_sub .i_box{
				top:25%;
				right: 2%;
			}


			  
		/*　その他　*/
		
		.bg_green,
		.bg_green2{
			width:100%;
			margin:0;
			padding:5px;
			clear:both;
			}
		.bg_green{
			background:#e7f0f8;	
			font-size:14px;
		}
		
		.bg_green2{
			background:#e7f0f8;	
			font-size:13px;
			font-weight:bold;
		}
		
		
		.fl{ float:left; }
		.fr{ float:right; }
		
	
		
		/*
		汎用セレクタ
		---------------------------------------------*/
		.tbl_simple{}
		.tbl_simple th,
		.tbl_simple td{
			padding:8px 10px;
			font-size:14px;}
		


    .btn-txt{text-align: center;}
    .btn-txt a{}

}



@media only screen and (max-width: 600px){

			

.list-suggestion ul li{
	background:url(../images/icon-check.png) no-repeat 0 4px;
	font-size:3.5vw;
	background-size: auto 16px;
	padding-left:22px;
	}	



}




/* 幅414px以下から iphone6& plus
------------------------------------------------------------*/
@media only screen and (max-width: 414px){



.list-suggestion ul li{
	background:url(../images/icon-check.png) no-repeat 0 0px;
	font-size:3.5vw;
	background-size: auto 16px;
	padding-left:22px;
	}	

}


/*  iphone7 etc.
------------------------------------------------------------*/
@media only screen and (max-width: 375px){

.list-suggestion ul li{
	background:url(../images/icon-check.png) no-repeat 0 0px;
	font-size:3.5vw;
	background-size: auto 14px;
	padding-left:20px;
	}
	
}

/*  iphone5 etc.
------------------------------------------------------------*/
@media only screen and (max-width: 320px){


	
	.sp_navi ul li a{
		padding:5px 0px;
	}
	.sp_navi ul li{
		width:35%;
	}
	.sp_navi ul li:nth-child(3),
	.sp_navi ul li:nth-child(6),
	.sp_navi ul li:nth-child(9){
	
		border-right:0;
		width:28%;
		
	}
	.sp_navi ul li:nth-child(2),
	.sp_navi ul li:nth-child(5),
	.sp_navi ul li:nth-child(8){
		width:37%;
		
	}


}



.cta-box {
  background: rgba(255,255,255,1.00);
	box-shadow: 0 3px 8px rgba(0,0,5,0.1);
  text-align: center;
  padding: 2em 1em;
  border-radius: 12px;
	margin-bottom: 3em;
  
}

.cta-box .cta-content p {
  font-size: 1em;
	margin-bottom: 1em;
}

.cta-btn a{
  display: inline-block;
  background: #28a255;
	border: 5px solid #28a255;
  color: #FFF;
	font-size: 30px;
  padding: 0.75em 1.5em;
  font-weight: bold;
  border-radius: 50vh;
  text-decoration: none;
  transition: all 0.3s ease;
}

.cta-btn a:hover {
  background: #FFF;
  color: #28a255;
}

.cta-box .title_bubble{
	color: #28a255;
	font-weight: bold;
}
.cta-box .txt_notes{}



/* テーマ固有の修正　*/
#main_content{
	text-align:left;
}
#top_title_area.l-content__top.p-topArea.c-filterLayer.-filter-none.-noimg{
	margin: 0;
	padding: 0;
	background: #000;
	height: auto;
	
}
.p-topArea__body.l-container{
	margin: 0;
  color:#FFF;
	margin-bottom:4%;
	text-align:left;
}
.p-topArea__body.l-container h1.c-pageTitle__main{
  font-size:3.2rem;
  padding:2em 0;
}

#gnav ul li{
	font-size:1.5rem;

}


/*
サイト幅調整
カスタマイズで指定している幅を100%にする
*/
:root {
  --ark-width--container: 100% !important;
  --ark-width--article: 100% !important;
  --ark-width--article--slim: 100% !important;
}

/*FAQの幅*/
.l-main__body.p-page.post-424{
	max-width: 1200px;
	margin: auto;
}
.post-424{}
/* Q: 質問の前にQラベル */
.post-424 .esab__heading_tag::before {
	content: "Q.";
	font-weight: bold;
	color: #0073aa;
	margin-right: 0.5em;
}

/* A: 回答本文の前にAラベル（最初のp要素に） */
.post-424 .esab__body > p:first-of-type::before {
	content: "A.";
	font-weight: bold;
	color: #0073aa;
	margin-right: 0.5em;
}