﻿@charset "UTF-8";
/* PCだけ表示 */
.visible_l,img.visible_l,span.visible_l,br.visible_l,td.visible_l,th.visible_l,tr.visible_l,table.visible_l {
	display: none !important;
}

/* SPだけ表示 */
.visible_s {
	display: block !important;
}
span.visible_s,img.visible_s,br.visible_s {
	display: inline !important;
}
table.visible_s {
	display: table !important;
}

img{
	max-width:100%;
	width:100%;
	height:auto;
	margin:0;
}

.a-left{
		text-align:left;
	}
.a-right{
		text-align:right;
	}
.a-center{
		text-align:center;
	}
	
.f-center{
	display: block!important;
	text-align:center!important;
	margin-left:auto!important;
	margin-right:auto!important;
	}

.va-m{
	width:auto;
	vertical-align: middle;
}

img.auto{
	width:auto!important;
}
.css-fade1{
  /* アニメーション設定*/
  animation-name:fade-in1;
  animation-duration:1s; /*アニメーション時間*/
  animation-timing-function: ease-out; /*アニメーションさせるイージング*/
  animation-delay:0.1s; /*アニメーション開始させる時間*/
  animation-iteration-count:1; /*繰り返し回数*/
  animation-direction:normal; /*往復処理をするかどうか*/
  animation-fill-mode: forwards; /*アニメーション後のスタイルをどうするか*/
}
/* アニメーション*/
@keyframes fade-in1 {
  0% {opacity: 0; transform: translate3d(0,0,0);}
  100% {opacity: 1; transform: translate3d(0,0,0);}
}
.css-fade2{
  /* アニメーション設定*/
  animation-name:fade-in2;
  animation-duration:6s; /*アニメーション時間*/
  animation-timing-function: ease-out; /*アニメーションさせるイージング*/
  animation-delay:1s; /*アニメーション開始させる時間*/
  animation-iteration-count:1; /*繰り返し回数*/
  animation-direction:normal; /*往復処理をするかどうか*/
  animation-fill-mode: forwards; /*アニメーション後のスタイルをどうするか*/
}
/* アニメーション*/
@keyframes fade-in2 {
  0% {opacity: 0; transform: translate3d(0,20px,0);}
  20% {opacity: 1; transform: translate3d(0,0,0);}
  80% {opacity: 1; transform: translate3d(0,0,0);}
  100% {opacity: 0; transform: translate3d(0,0,0);}	
}
.css-fade3{
  /* アニメーション設定*/
  animation-name:fade-in3;
  animation-duration:6s; /*アニメーション時間*/
  animation-timing-function: ease-out; /*アニメーションさせるイージング*/
  animation-delay:1.5s; /*アニメーション開始させる時間*/
  animation-iteration-count:1; /*繰り返し回数*/
  animation-direction:normal; /*往復処理をするかどうか*/
  animation-fill-mode: forwards; /*アニメーション後のスタイルをどうするか*/
}
/* アニメーション*/
@keyframes fade-in3 {
  0% {opacity: 0; transform: translate3d(0,20px,0);}
  20% {opacity: 1; transform: translate3d(0,0,0);}
  80% {opacity: 1; transform: translate3d(0,0,0);}
  100% {opacity: 0; transform: translate3d(0,0,0);}	
}
.css-fade4{
  /* アニメーション設定*/
  animation-name:fade-in4;
  animation-duration:6s; /*アニメーション時間*/
  animation-timing-function: ease-out; /*アニメーションさせるイージング*/
  animation-delay:8s; /*アニメーション開始させる時間*/
  animation-iteration-count:1; /*繰り返し回数*/
  animation-direction:normal; /*往復処理をするかどうか*/
  animation-fill-mode: forwards; /*アニメーション後のスタイルをどうするか*/
}
/* アニメーション*/
@keyframes fade-in4 {
   0% {opacity: 0; transform: translate3d(0,20px,0);}
  20% {opacity: 1; transform: translate3d(0,0,0);}
  100% {opacity: 1; transform: translate3d(0,0,0);}
}
.css-fade5{
  /* アニメーション設定*/
  animation-name:fade-in5;
  animation-duration:6s; /*アニメーション時間*/
  animation-timing-function: ease-out; /*アニメーションさせるイージング*/
  animation-delay:8.5s; /*アニメーション開始させる時間*/
  animation-iteration-count:1; /*繰り返し回数*/
  animation-direction:normal; /*往復処理をするかどうか*/
  animation-fill-mode: forwards; /*アニメーション後のスタイルをどうするか*/
}
/* アニメーション*/
@keyframes fade-in5 {
   0% {opacity: 0; transform: translate3d(0,20px,0);}
  20% {opacity: 1; transform: translate3d(0,0,0);}
  100% {opacity: 1; transform: translate3d(0,0,0);}
}
.css-fade6{
  /* アニメーション設定*/
  animation-name:fade-in6;
  animation-duration:4s; /*アニメーション時間*/
  animation-timing-function: ease-out; /*アニメーションさせるイージング*/
  animation-delay:1.5s; /*アニメーション開始させる時間*/
  animation-iteration-count:1; /*繰り返し回数*/
  animation-direction:normal; /*往復処理をするかどうか*/
  animation-fill-mode: forwards; /*アニメーション後のスタイルをどうするか*/
}
/* アニメーション*/
@keyframes fade-in6 {
  0% {opacity: 0; transform: translate3d(0,20px,0);}
  20% {opacity: 1; transform: translate3d(0,0,0);}
  100% {opacity: 1; transform: translate3d(0,0,0);}
}
/*clearfix
----------------------------------------*/
.clearfix { zoom:1; }

.clearfix:after {
	content: "";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	font-size: 0.1em;
	line-height: 0;
}
.clr{
	clear: both;
}

/*margin
----------------------------------------*/

/*top*/
.mt0{ margin-top: 0px !important; }
.mt05{ margin-top: 5px !important; }
.mt10{ margin-top: 10px !important; }
.mt15{ margin-top: 15px !important; }
.mt20{ margin-top: 20px !important; }
.mt25{ margin-top: 25px !important; }
.mt30{ margin-top: 30px !important; }
.mt40{ margin-top: 40px !important; }
.mt50{ margin-top: 50px !important; }
.mt60{ margin-top: 60px !important; }
.mt70{ margin-top: 70px !important; }
.mt80{ margin-top: 80px !important; }
.pt30{padding-top:30px!important;}

/*bottom*/
.mb0 { margin-bottom: 0px !important; }
.mb05 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb80 { margin-bottom: 80px !important; }

/*right*/
.mr05 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }

/*left*/
.ml05 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }

.pt40{
	padding-top:40px;
}

/*font-size
----------------------------------------*/

.font10 { font-size: 77% !important; }
.font11 { font-size: 85% !important; }
.font12 { font-size: 93% !important; }
.font13 { font-size: 100% !important; }
.font14 { font-size: 108% !important; }
.font15 { font-size: 116% !important; }
.font16 { font-size: 123.1% !important; }
.font17 { font-size: 131% !important; }
.font18 { font-size: 138.5% !important; }
.font19 { font-size: 146.5% !important; }
.font20 { font-size: 153.9% !important; }
.font21 { font-size: 161.6% !important; }
.font22 { font-size: 167% !important; }
.font23 { font-size: 174% !important; }
.font24 { font-size: 182% !important; }
.font25 { font-size: 189% !important; }
.font26 { font-size: 197% !important; }
.fontb { font-weight: bold !important; }

/*font-color
----------------------------------------*/
.red{color:#cc0000!important;}
.blue{color:#0076bc!important;}
.green{	color:#129330!important;}
.ygreen{color:#9adb77!important;}
.pink{color:#e65c6d!important;}
.og{color:#DC6C00;}

.bg_gray{background:#f5f4f2;}
.bg_gray2{background:#ededed;}

/* 字下げ */
.txt_idt{
   padding-left: 1em !important;
   text-indent: -1em !important;	
}
/* 字下げ 5*/
.txt_idt2{
   padding-left: 4em !important;
   text-indent: -4em !important;	
}
div.moushikomi{
	background: url(../../images/top/bg_pink.png) no-repeat;
	background-size:100% 100%;
	padding:30px 0;
}
.waku_border_pink{
	font-size:14px;
	border:1px dotted #de7676;
	padding:15px;
	margin:20px 0 0 0;
	line-height: 200%;
}

/*タブ切り替え全体のスタイル*/
.tabs{
	width:96%;
	margin: 20px auto 20px auto;
	background-color: #fff;
	box-sizing: border-box;
}

/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 96%;
  margin: 0 auto;
}

/*タブのスタイル*/
.tab_item {
	box-sizing: border-box;
  width: calc(100%/2);
  height: 40px;
  border-bottom: 3px solid #de7676;
  background-color: #d9d9d9;
  line-height: 40px;
  font-size: 14px;
  text-align: center;
	padding-left:15px;
  color: #565656;
  display: block;
  float: left;
  transition: all 0.2s ease;
	background: #d9d9d9 url("../../images/base/mouse.png") no-repeat  left center;

}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 20px 20px 0;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#net:checked ~ #net_content,
#net2:checked ~ #net2_content{
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #de7676;
  color: #fff;
	background-image: none;
	text-align: center;
	padding-left:0;
}
.tab_item2 {
	box-sizing: border-box;
	width: calc(100%/2);
	height: 40px;
	border-bottom: 3px solid #de7676;
	line-height: 40px;
	font-size: 14px;
	text-align: center;
	color: #fff;
	display: block;
	float: left;
	transition: all 0.2s ease;
	background-color: #de7676;	
	padding-left:0;
}
.tab_content ul span{
	font-size:22px;
	color:#de7676;
	vertical-align: middle;
}
.tab_content ul  li{
	counter-increment : chapter;
	padding:10px 0 0 20px;
	padding-left:2em;
	text-indent:-2em;
}
.tab_content ul li:before {
	content : counter(chapter);
	padding-right: 10px;
	color:#de7676;
	font-size:30px;
} 

.tab_content ul  li img{
	width:50px;
	vertical-align: middle;
}
.tab_content ul  li .tel{
	font-size:26px;
}
.tab_content ul  li .form{
	background:#de7676;
	color:#fff;
	border-radius: 20px;
	padding:5px 20px;
	margin-top:10px;
	display: inline-block;
	width:80%;
	text-align: center!important;
	max-width: 350px;
}
.kit{
	width:96%;
	background: #fff;
	margin:20px auto 0 auto;
	padding:20px;
	font-size:15px;
}
.kit h3{
	text-align: center;
	font-size:17px;
	font-family: "NotoSerif_R";
	margin-bottom:20px;
}
.to_cart{
	padding:15px 0;
	background: url(../../images/top/bg_green.png) no-repeat;
	margin:0 auto;
	font-size:17px;
	line-height: 200%;
}
.to_cart div{
	width:96%;
	border:2px solid #377c90;
	background: #fff;
	margin:0 auto;
	padding:20px;
}
.to_cart div .tel{
	text-align: center;
	font-size:30px;
	font-family: "NotoSerif_R";
	margin:15px 0;
}

