@charset 'UTF-8';


/*==========================
　　　　　  Reset
==========================*/

body {
	color: #000;
	font-family: Helvetica, Arial, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', meiryo, 'メイリオ', 'ms pgothic', sans-serif;
	font-size:62.5%;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin: 0;
	padding: 0;
	overflow-x: hidden;
}


img {
	max-width: 100%;
	vertical-align: bottom;
}

ul  {
	margin:0;
	padding:0;
}

li {
	list-style-type: none;
}

p {
	margin:0;
	padding:0;
	font-size: 1.6em;
	line-height: 1.5em
}


a {
	text-decoration: none;
	color: #000;
}

a, img, article, input, textarea {
  text-decoration:none;
  -webkit-transition: .2s;
  -moz-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;  
  transition: .2s;
}


h1, h2, h3, h4, h5, h6 {
	margin:0;
	padding:0;
}

dl, dt, dd {
	margin:0;
	padding:0;
}
small {
	font-size: 1em;
}

:focus {
  outline:none;
}


/*==========================
　　　　　　Common
==========================*/
.wrapper {
	width: 100%;
	overflow: hidden;
}

.float_wrap {
	overflow: hidden;
}

.txt {
	line-height: 1.8em;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
	padding:10px;
}

.txt_b {
	font-weight: bold;
}
.txt_red {
	color:#F00;
}

.txt_green {
	color:#69AF80;
}

.txt_blue {
	color:#00A0E9;
}

.txt_white {
	color:#FFFFFF;
}

.blue-link {
	color:#000080;
}

.blue-link:hover{
	color:#02688C;
}

.link-hover:hover{
	color:#00A0E9;
}
.ft07 {
	font-size:0.6em;
}

.ft08 {
	font-size:0.7em;
}

.ft12 {
	font-size:1.2em;
}

.ft14 {
	font-size:1.4em;
}

.ft18 {
	font-size:1.5em;
	line-height: 1.5em;
}
.aki {
	line-height: 200%;
}

.ft20 {
	font-size:2.0em;
}

.ft30 {
	font-size:3.0em;
}


.mincho {
   font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.marugo{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

.fw_bold {
	font-weight:bold;
}

.disc li {
	list-style-type: disc;
	margin-left:15px;
}

.kakomi-box1 {
 margin: 50px;
 padding: 10px;
 width: 90%;
 background-color: #fff; /* 背景色 */
 border: 1px solid #ccc; /* 枠線 */
}

/* ボタン */

.more-btn {
	max-width: 250px;
	color: #777;
	border: 1px solid #777;
	box-sizing: border-box;
	text-align: center;
	font-size: 1.4em;
	font-weight: bold;
	margin: 30px auto 0;
	padding: 15px 0;
	position: relative;
}
.more-btn {
	display: block;
	line-height: 1;
}
a.more-btn:hover {
	color: #FFF;
	background: #777;
}

/*画像リンクを半透明化*/
a:hover img.alpha {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

/*矢印アイコン*/
.arrow{
    position: relative;
    display: inline-block;
    padding: 0 0 0 12px;
    color: #777;
    vertical-align: middle;
    text-decoration: none;
}

.arrow::before,
.arrow::after{
    position: absolute;
    top: 0;
    bottom: 4px;
    left: 12px;
    margin: auto;
    content: "";
    vertical-align: middle;
}

.arrow::after{
    right: 3px;
    width: 8px;
    height: 8px;
    border-top: 3px solid #777;
    border-right: 3px solid #777;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

a.more-btn:hover .arrow::after{
    border-top: 3px solid #FFF;
    border-right: 3px solid #FFF;
}

.btn {
	max-width: 300px;
	border: 1px solid #251e1c;
	box-sizing: border-box;
	text-align: center;
	font-size: 2.0em;
	font-weight: bold;
	margin: 30px auto 0;
	position: relative;
}
.btn a {
	display: block;
	padding: 22px 20px 20px;
	line-height: 1;
}
.btn a:hover {
	background: #dcdcdd;
}
.btn.gaibu:before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background: url(../common/gaibu_ico.png) no-repeat center center;
	background-size: 16px;
	position: absolute;
	top: 5px;
	right: 5px;
}
/* WEBアイコン */
i {
	padding-right: 5px;
}

i.ic-blue {
	color: #036EB8;
}


.center {
	text-align: center;
}

.w90{
	width: 90%;
	margin: 0 auto;
}

.w80{
	width: 80%;
	margin: 0 auto;
}
 .img80 img{
	width: 80%;
	margin: 0 auto;
}



/*スマホのみ改行 */
@media print, screen and (min-width:650px){
	.md {
		display: none !important;
	}
	}
/*タブレットのサイズで改行 */
@media print, screen and (min-width:834px){
	.tb {
		display: none !important;
	}	
	}

/*PCのみ改行 */
@media print, screen and (max-width:835px){
	.sp {
		display: none !important;
	}
	}
/*改行ヘッダーのコピー用 */
@media print, screen and (min-width:1150px){
	.headcopy {
		display: none !important;
	}
	}
/*フェードイン */
.fadein {
  opacity : 0;
  transform: translateY(20px);
  transition: all 1s;
}		

/*ブロックごと右寄せ */
.f_right p {
	float: right;	
}
.f_right:before,
.f_right:after{
    content: "";
    display: table;
}
.f_right:after{ clear: both; }
.f_right{ zoom: 1; } /* For IE 6/7 */


.center_img{
	max-width:800px;
	width:100%;
	display:block;
	margin:0 auto;
}


.indent-1 {
padding-left:0.7em;
text-indent:-0.7em;
}

.indent-1-1 {
	padding-left:0.7em;
	text-indent:-0.8em;
	}

/* スペース */
.spacer_top10 {margin-top:10px;}
.spacer_top20 {margin-top:20px;}
.spacer_top25 {margin-top:25px;}
.spacer_top40 {margin-top:40px;}
.spacer_top50 {margin-top:50px;}
.spacer_top100 {margin-top:100px;}


/*==========================
　　　　　　Header
==========================*/
header {
	width: 100%;
}

header .header_row {
	box-sizing: border-box;
	height: 300px;
}

header .header_row.index07 {
	box-sizing: border-box;
	height: 330px;
}

header .header_row2 {
	box-sizing: border-box;
	height: 120px;
	border-bottom: 1px #000000 solid;
}


header .inner {
	box-sizing: border-box;
	position: relative;
	width: 100%;
	background-color: #FFF;
	margin:0;
	padding:10px;
}



header .row-logos{
	display: block;
	margin: auto;
}

header .row-logos h1{
	text-align: center;
	font-size: 3.0em;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	letter-spacing: 10px;
}


header .row-logos img.logo{
	width: 200px;
	display: block;
	margin: auto;
}


header .row-logos-w .logo-left{
	display: inline-block;
	vertical-align: middle;
}

header .row-logos-w h1{
	font-size: 2.0em;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	letter-spacing: 5px;
}

header .row-logos-w h1 span{
	font-size: 0.8em;
}


header .row-logos-w img.logo{
	width: 150px;
}


header .name{
	font-size: 1.6em;
}


/*==========================
　　　　　　Footer
==========================*/
footer {
	margin-top: 50px;
	overflow-x: hidden;
	background-color: #ddd;
	border-top: 1px solid #000;
}
.pagetop {
	float: right;
	position: fixed;
	bottom:30px;
	right: 5%;
	z-index: 999;
}

footer .inner {
	width:95%;
	margin:30px auto;
	display: block;
	
}

footer .inner .row{
	display: block;
	text-align: center;
}


footer .site-name span{
  font-size: 1.6em;
  font-weight: bold;
  letter-spacing: 5px;
}

footer .address {
	text-align: center;
	display: block;
	margin: 0 auto;
	line-height: 2.5em;
	
}

footer .address.rsk {
	margin: 20px auto 40px;
	
}

footer .address .site-name{
  font-size: 1.6em;
  font-weight: bold;
}
	

footer a {
	color: #000;
}

footer a:hover {
	color:#00A0E9;
}



/*==========================
　　　　　　 Top
==========================*/


/* トップページスライド */
.slider-wrap{
   display: block;
   position: relative;
   z-index: 999;
}
.slide { margin: 0 0 50px;}
.slide img { width: 100%; height: auto;}
.slide .slick-next { right: 20px; top: 50%; z-index: 99;}
.slide .slick-prev { left: 15px; top: 50%; z-index: 100;}


/*スマホ用スライダー非表示 */
@media print, screen and (min-width:801px){
	.sp-sl {
		display: none !important;
	}
	}

/*PC用スライダー非表示 */
@media print, screen and (max-width:800px){
	.pc-sl {
		display: none !important;
	}
	}

/* コンテンツ */
.contents {
	width: 100%;
    margin: 0 auto;
}

.greeting {
	width: 90%;
    margin: 30px auto;
}

.greeting h2{
	font-size: 3.0em;
}

.greeting-left,.greeting-right {
	width: 100%;
    margin:auto;
	display: block;
}

.greeting-left img {
	margin: 0 auto;
	display: block;
}

.greeting-right {
    margin-top: 15px;
}

.category {
    margin-top: 80px;
}

.blue-back {
	text-align: center;
	background: -moz-linear-gradient(top, #a1cbed, #d3edfb);
	background: -webkit-linear-gradient(top, #a1cbed, #d3edfb);
	background: linear-gradient(to bottom, #a1cbed, #d3edfb);
}

.blue-back h2 {
	padding: 20px;
	font-size: 2.0em;
}

.pink-back {
	text-align: center;
	padding: 3px 10px;
	max-width: 800px;
	box-sizing: border-box;
	display: block;
	margin: 20px auto;
	background: -moz-linear-gradient(top, #FBE6EF, #F19DB5);
	background: -webkit-linear-gradient(top, #FBE6EF, #F19DB5);
	background: linear-gradient(to bottom, #FBE6EF, #F19DB5);
}


.category-row {
	width: 100%;
	margin-top: 5px;
	background-color: #f0eccd;
}

.category-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 90%;
	margin:auto;
	padding-bottom:30px;
}

.category-box{
	position: relative;
	width: 49%;
	margin-top: 30px;
	overflow: hidden;
	background-color: #fff;
}

.category-box img{
	position: relative;
	z-index: 99;
	width: 100%;
	display: block;
	transition-duration: 0.5s;
}

.category-box img:hover{
  transform: scale(1.2);
  -duration: 0.5s;
}

.category-box .w-back{
	position: absolute;
	z-index: 100;
	top: 0;
	height: 60px;
	width: 100%;
	background-color: rgba( 255, 255, 255, 0.55 );
}

.category-box h3{
	font-size: 3.0em;
	position: absolute;
	z-index: 110;
	top: 10px;
	left: 10px;
	height: 60px;
}

.order-form-list{
	display: table;
	width: 100%;
	table-layout:fixed;
	
}

.order-form-list .list{
	display:table-row;
}

.order-form-list .list .box{
	display: table-cell;
	padding: 10px 0;
	border-bottom: 1px solid #000;
	vertical-align: top;
}

.order-form-list .list .left{
	font-weight: bold;
}

.order-txt{
	font-size: 1.8em;
	text-align: center;
	font-weight: bold;
	margin: 50px auto 10px;
}

.privacy{
	border-top: solid #000 1px;
	margin: 50px auto 10px;
	padding-top: 20px;
}


/*==========================
　　　　　　PAGE
==========================*/

.login-form{
  display: block;
  margin: 30px auto;
  width: 350px;
}

.button-wrap{
  display: flex;
  margin: 0 auto;
  flex-wrap: wrap;
  justify-content: center;
}

.button-wrap a{
  margin: 0 5px;
}


.white-btn {
	width: 350px;
	color: #036eb8;
	border-radius: 30px;
	border: 1px solid #036eb8;
	box-sizing: border-box;
	text-align: center;
	font-size: 2.0em;
	font-weight: bold;
	margin: 30px auto 0;
	padding: 15px 0;
	position: relative;
}
.white-btn {
	display: block;
	line-height: 1;
}

a .white-btn {
	transition: 1.0s ;
}

a .white-btn:hover {
	color: #FFF;
	background: #036eb8;
}
.red-btn {
	width: 350px;
	color: #ff0000;
	border-radius: 30px;
	border: 1px solid #ff0000;
	box-sizing: border-box;
	text-align: center;
	font-size: 2.0em;
	font-weight: bold;
	margin: 30px auto 0;
	padding: 15px 0;
	position: relative;
}
.red-btn {
	display: block;
	line-height: 1;
}

a .red-btn {
	transition: 1.0s ;
}

a .red-btn:hover {
	color: #FFF;
	background: #ff0000;
}

.orange-btn {
	max-width: 350px;
	color: #FFF;
	border-radius: 15px;
	box-sizing: border-box;
	text-align: center;
	font-size: 2.0em;
	font-weight: bold;
	margin: 30px auto 0;
	padding: 15px 0;
	position: relative;
	background-color: #ea5514;
}
.orange-btn {
	display: block;
	line-height: 1;
}

a .orange-btn {
	transition: 1.0s ;
}

a .orange-btn:hover {
	color: #FFF;
	background: #f5a200;
}


.login-btn {
	max-width: 250px;
	color: #FFF;
	border-radius: 30px;
	background:linear-gradient(#008cb4, #2ea7e0);
	border: 1px solid #FFF;
	box-sizing: border-box;
	text-align: center;
	font-size: 2.0em;
	font-weight: bold;
	margin: 30px auto 0;
	padding: 15px 0;
	position: relative;
}
.login-btn {
	display: block;
	line-height: 1;
}

a .login-btn {
	transition: 1.0s ;
}

a .login-btn:hover {
	color: #f00;
	background: #FFF;
	border: 1px solid #036eb8;
}

.login-form form{
  display: block;
  margin: 40px auto;
}

.login-form p span{
  font-weight: bold;
  font-size: 1.2em;
}

.login-form input{
  width: 100%;
  height: 2.0em;
  font-size: 1.0em;
  margin-bottom: 20px;
}

.otoiawase{
  width: 98%;
  display: block;
  margin: 30px auto;
  text-align: center;
}

.otoiawase span{
  font-weight: bold;
  font-size: 1.6em;
}

.otoiawase a:hover{
  color:#00A0E9;
}

.red-waku{
  color:  #FF0000;
  font-weight: bold;
  font-size: 2.0em;
  width: 85%;
  max-width: 1000px;
  border: 1px #FF0000 solid;
  display: block;
  text-align: center;
  margin: 50px auto;
  padding: 10px;
}

.order {
	width: 90%;
	display: block;
	max-width: 1000px;
	margin: auto;
}


.order-list {
	display: flex;
	flex-wrap: wrap;
	margin:25px auto;
}

.order-list .number{
	display: inline-block;
	width: 60px;
	height: 60px;
	text-align:center;
	line-height: 60px;
	border-radius: 50%;
	background:linear-gradient(#008cb4, #2ea7e0);
	color: #FFF;
	font-weight: bold;
	font-size: 2.0em;
}

.order-list .txt{
	width: 85%;
	vertical-align: middle;
}

.order-list .txt span{
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.6em;
}

.change-point{
	margin: 0 auto 50px;
}

.change-txt{
	margin-bottom: 20px;
}

.page-ttl {
	text-align: center;
	background-color: #f0eccd;
}

.page-ttl h2 {
	padding: 15px;
	font-size: 3.5em;
	font-weight: bold;
	margin: 50px auto 30px;
	letter-spacing: 0.5em
}

.page-ttl2 {
	text-align: center;
}

.page-ttl2 h2 {
	padding: 15px;
	font-size: 3.5em;
	font-weight: bold;
	margin: 30px auto 20px;
	letter-spacing: 0.5em
}

.block-3 {
	width: 90%;
	margin-top: 5px;
	display: block;
	margin: auto;
}

.block-3-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin:auto;
	padding-bottom:30px;
}

.block-3 .block-3-inner .box{
	width: 49%;
	margin-top: 30px;
	overflow: hidden;
	background-color: #fff;
}



.block-3 .block-3-inner .box img{
	width: 100%;
	display: block;
	transition-duration: 0.5s;
}

.category-box img:hover{
  opacity: 0.8;
}

.kakutei {
	font-size: 1.2em;
	font-weight: bold;
	display: block;
	margin: 100px auto;
	text-align: center;
}

.product-block {
	width: 90%;
	display: block;
	max-width: 600px;
	margin: auto;
}

.product-name{
	margin-bottom: 30px;
}


.product-name h3{
	font-size: 1.8em;
	font-weight: bold;
	margin: 20px auto;
}


.zaiko{
	display: block;
	margin: auto;
	text-align: center;
}

.zaiko p{
	display: inline-block;
	margin: 20px 5px;
}

.yellow-back{
  display:block;
  text-decoration: none;
  background-color: #dae000;
  outline: none;
  color: #000;
  border-radius:10px;
  border:0;
  padding:5px 5px;
  margin-right: 10px;
  font-size: 2.0em;
  font-weight: bold;
}

.residue{
  font-size: 2.0em;
  font-weight: bold;
}

.confirmation {
	width: 95%;
	display: block;
	max-width: 1000px;
	margin: auto;
}

.form-d-txt{
	border: 1px solid #f00;
	color: #f00;
	padding: 8px;
	box-sizing: border-box;
	width: 90%;
	max-width: 500px;
	margin:20px 0 0 20px;
}

.order-m {
	width: 100%;
	display: block;
	border: 1px solid #000;
	font-size: 1.8em;
	font-weight: bold;
	padding:5px;
	margin: 20px auto;
	box-sizing: border-box;
	
}

.order-product {
	display: flex;
	flex-wrap: wrap;	
}

img.order-img {
	max-width: 300px;	
}
	
.order-product p{
	font-size: 1.8em;
	font-weight: bold;	
}

.required {
	text-decoration: none;
	background-color: #e60012;
	outline: none;
	color: #fff;
	border-radius:10px;
	border:0;
	padding:5px 10px;
	margin-left: 5px;
	font-size: 0.9em;
	font-weight: bold;
}


.order-form-list .form{
	padding:5px 5px; 
	border:1px #999999 solid;
	height: 18px;
	font-size: 16px;
	color: #000;
}

.order-form-list .form{
	padding:5px 5px; 
	border:1px #999999 solid;
	height: auto;
	font-size: 16px;
	color: #000;
}

.order-form-list .select{
	padding:0 5px; 
	border:1px #999999 solid;
	height: 1.6em;
	font-size: 16px;
	color: #000;
	line-height: 1.0em;
}


.yubin-btn {
	text-decoration: none;
	background-color: #ffe329;
	outline: none;
	color: #000;
	border-radius:10px;
	border:0;
	padding:5px 10px;
	margin-left: 5px;
	font-size: 1.2em;
	font-weight: bold;
}

.yubin-btn:hover {
	background-color: #2ea1ff;
	outline: none;
	color: #fff;
	border-radius:10px;
	border:0;
	padding:5px 10px;
	margin-left: 5px;
	font-size: 1.2em;
	font-weight: bold;
}

.mail-btn {
	margin:50px auto 0;
	padding: 10px 0px;
	display:block;
	width: 250px;
	text-align: center;
	border: none;
	text-decoration: none;
	outline: none;
	color: #FFF;
	border-radius:10px;
	font-size: 2.0em;
	font-weight: bold;
	background: #ea5514; /* Old browsers */
	-webkit-appearance:none;
}


.mail-btn:hover {
	background: #f5a200;
}

.mail-btn::before,
.mail-btn::after {
	position: absolute;
	z-index: -1;
	display: block;	
	content: '';
}
.mail-btn,
.mail-btn::before,
.mail-btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;	
}


/*==========================
　　　　　　PAGE
==========================*/
.page {
	width: 98%;
    margin: 0 auto;
}

.block-inner {
	width: 98%;
    margin: 0 auto 30px;
}	

.top-img {
	position: relative;
}	

.top-img img{
	width: 100%;
}

.top-img img.absolute{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	max-width: 1000px;
}

img.login07{
	display: block;
	margin: 50px auto;
	max-width: 1000px;
}

/*見出し*/
h2.subttl {
	text-align: center;
	font-weight:bold;
	font-size: 3.5em;
	line-height: 0.6em;
}

h2.subttl span {
	font-size: 0.4em;
}


h2.midasi-first {
	border-top: 4px solid #13AE67;
	text-align: left;
	font-weight:bold;
	background-color: #FFF67F;
	font-size: 2.5em;
	color: #000;
	margin:50px 0 40px;
	line-height: 2em;
	width:98%;
	padding: 2px 0px 2px 15px;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}


h3.s_midasi {
	max-width:100%;
	border-left: 6px solid #13AE67;
	border-bottom: 1px solid #777;
	text-align: left;
	background-color: #fff;
	font-size: 2.2em;
	margin: 50px 0 15px;
	padding: 0px 3px 5px 10px;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}




.m-bar{
  display:block;
  margin: 25px auto;
  width: 350px;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #FFF;
  border-radius:20px;
  border:0;
  padding:5px 5px;
  font-size: 2.0em;
  font-weight: bold;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";	
}

.m-bar.green{
  background-color: #13AE67;
}
.m-bar.orange{
  background-color: #F39800;
}


.start-img{
  display: block;
  margin: auto;
  width: 98%;
  max-width: 1200px;
}

.start-btn{
  display: block;
  margin: 30px auto;
  width: 80%;
  max-width: 300px;
}

.login07-top-txt{
  text-align: center;
  font-weight: bold;
}

.present{
  display: block;
  max-width: 1000px;
  margin: 30px auto 50px;
}


.present ul{
  display: flex;
}

.present .present-1{
  border-top: 2px #E4007F solid;
  border-bottom: 2px #E4007F solid;
}
.present .present-2{
  border-bottom: 2px #E4007F solid;
}

.present-1 p,.present-2 p{
  padding: 3px 0;
  font-size: 2.0em;
  font-weight: bold;
  padding-left:1em;
  text-indent:-1.0em;	
}

.present a:hover{
	color:#00A0E9;
}


.red-maru{
  padding: 3px 0;
  margin: 10px 0;
  font-size: 1.0em;
  font-weight: bold;
  background-color: #E60012;
  width: 150px;
  color: #fff;
  border-radius: 10px;
  text-align: center;
}

.rule{
	border: 1px solid #000;
	max-width: 800px;
	width: 90%;
	margin: 0 auto 100px;
	display: block;
}

.rule .rule-ttl{
	border-bottom: 1px solid #000;
	padding: 5px 0;
	box-sizing: border-box;
	text-align: center;
	font-size: 3.0em;
	font-weight: bold;
}

.rule .rule-txt{
	padding: 8px;
	box-sizing: border-box;
	font-size: 1.8em;
	font-weight: bold;
}

.rule .rule-txt span{
	font-size: 0.8em;
}

.coution{
	font-size: 1.8em;
	font-weight: bold;
	color: #F00;
	padding-left: 53px;
	margin: 30px auto 0;
	max-width: 820px;
    background: url(../images/coution.png) no-repeat left center;
}

/*テーブル*/
table{
border-collapse:collapse;
margin:10px auto 0;
width: 100%;
table-layout: fixed;
word-wrap: break-word;
font-size: 1.6em;	
}

table th{
position: static;	
letter-spacing:1px;
vertical-align: middle;
border:1px solid #cacaca;
}

table th,table td{
position: static;
border:1px solid #cacaca;
vertical-align: middle;
padding: 5px;
}

table th{
text-align: center;
font-weight: bold;
font-size: 1.2em
}


/*テーブル（スクロール）*/
table.table_sc{
border-collapse:collapse;
width:100%;
margin:20px auto;
table-layout: fixed;
word-break: break-all
}


table.table_sc th{
position: static;
padding:5px;
letter-spacing:1px;
vertical-align: middle;
text-align: center;	
border:1px solid #cacaca;

}

table.table_sc th,table.table_sc td{
position: static;	
padding:5px;
border:1px solid #cacaca;
vertical-align: middle;
}


/*テーブル用装飾*/
table .tw_10{
width:10%;
}
table .tw_25{
width:25%;
}
table .tw_30{
width:30%;
}
table .tw_50{
width:50%;
}

table .tw_70{
width:70%;
}
table .th_120{
height:120px;
}


table .td_r{
text-align: right;
}

table .td_c{
text-align: center;
}

table .yellow{
background-color:#FFFBC7;
}

table .green{
background-color:#CCE198;
}

table .pink{
background-color:#FADCE9;
}


.blue{
background-color:#D3EDFB;
}

table .orange{
background-color:#FCD68C;
}

table .t_ttl{
  font-size: 1.8em;
  font-weight: bold;
  padding: 8px 0;
}

table .t_ttl span{
  font-size: 1.4em;
}

table.th_50 td{
	 padding: 15px 10px;
}

table.re-table{
margin:20px 0 100px;
}


table.table_sc.t-img img{
width: 90%;
margin: auto;
display: block;
}

table.table_sc.t-img td{
border:0;
}




/*==========================
　　　　 Mail form
==========================*/

#formWrap {
	width:900px;
	margin:10px auto;
	padding:50px 0;
	color:#000;
	line-height:120%;
	font-size:1.6em;
}

.formTable{
	width:100%;
	margin:0 auto;
	border:none;
}
.formTable ul{
	display: -webkit-flex;
	display: flex;
	border-top: 1px solid #999;
}

.formTable ul li{
	padding:30px 10px;
	line-height: 1.5em;
}

.formTable li.name{
	width:35%;
	text-align:left;
	background:none;
	vertical-align: top;
}

#formWrap .form{
	padding:5px 5px; 
	border:1px #999999 solid;
	height: 18px;
	font-size: 1.6em;
	color: #000;
}

#formWrap textarea.form{
	padding:5px 5px; 
	border:1px #999999 solid;
	height: auto;
	font-size: 1.6em;
	color: #000;
}
	
#formWrap .red{
	color:#F00;
	font-size:1.3em;
}

input[type="radio"]{
   -webkit-transform: scale(1.1);
   transform: scale(1.1);
   margin-right: 0.5em;
}



.button {
	margin:50px auto 0;
	display: inline-block;
	width: auto;
	height: auto;
	text-align: center;
	text-decoration: none;
	outline: none;
	background-color: #5a76a2;
	color: #fff;
	border-radius:20px;
	width:150px;
	border:0;
	padding:5px 10px;
	font-size:1.5em;
	font-weight:bold;
}
.button:hover {
	background-color: #5aa099;
	color:#FFF;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;	
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;	
}



/*==========================
　　　　　  PC
==========================*/


@media print, screen and (min-width:835px){
	
header .row-logos h1{
	text-align: center;
	font-size: 2.5em;
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	letter-spacing: 10px;
}
	


.pc-none {display:none;}

.greeting {
	display: flex;
	max-width: 1200px;
    margin: 30px auto;
}

.greeting h2{
	padding-left: 20px;
}
	
.greeting p{
	padding: 20px;
}
	
.greeting-left {
	width: 30%;
}

.greeting-left img {
	margin: 0 auto;
	display: block;
	width: 95%;
}

.greeting-right {
	margin:15px auto 0 0;
	width: 45%;
}


.category-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1600px;
	margin:auto;
	padding-bottom:40px;
}

.category-box{
	position: relative;
	width: 32%;
	margin-top: 40px;
	overflow: hidden;
	background-color: #fff;
}
	
.order {
	width: 90%;
	display: block;
	max-width: 1000px;
	margin: 50px auto 80px;
}
	

.block-3-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1600px;
	margin:auto;
	padding-bottom:40px;
}

.block-3 .block-3-inner .box{
	position: relative;
	width: 32%;
	margin: 40px 0 50px;
	overflow: hidden;
	background-color: #fff;
}

.block-3 .block-3-inner .box img{
	margin-bottom: 20px;
}
.block-3 .block-3-inner p{
	font-size: 1.8em;
	font-weight: bold;
}
img.order-img {
	width: 300px;	
}
	
.order-product p{
padding-left: 20px;		
}
	
.order-form-list .list .left{
	width: 20%;
}
	
.login07-top-txt{
  font-size: 120%;
}	

}


/*==========================
　　　　　Tablet
==========================*/

@media screen and (max-width:834px){
header .header_row {
	box-sizing: border-box;
	height: 220px;
}	
	
header .header_row.index07 {
	box-sizing: border-box;
	height: 300px;
}
	
header .inner {
	padding:0;
}
header .row-logos img.logo{
	width: 150px;
}
	
header .row-logos h1{
	font-size: 2.0em;
	letter-spacing: 5px;
}	
header .header_row2 {
	box-sizing: border-box;
	height: 260px;
	border-bottom: 1px #000000 solid;
}
		
header .row-logos-w .logo-left{
	display: block;
	margin: auto;
	text-align: center;
}
	
header .row-logos h1,
header .row-logos-w h1{
	line-height: 1.8em;
}
	

header .row-logos-w img{
	margin-top: 20px;
}	
	
.greeting h2{
	font-size: 2.5em;
	padding-bottom: 20px;
}
	
.category-box .w-back{
	position: absolute;
	z-index: 100;
	top: 0;
	height: 40px;
	width: 100%;
	background-color: rgba( 255, 255, 255, 0.55 );
}

.category-box h3{
	font-size: 2.5em;
	position: absolute;
	z-index: 110;
	top: 1px;
	left: 10px;
	height: 40px;
}
	
.order-product {
	display: block;
	margin: auto;
}	
img.order-img {
	max-width: 400px;
	width: 80%;
	display: block;
	margin: auto;
}
.order-product p{
	padding: 0;	
	width: 90%;
	max-width: 400px;
	display: block;
	margin: 20px auto 0;
}
	
.order-product p.form-d-txt{
	padding: 8px;
}	

.order-form-list .list .left{
	width: 100%;
	border: none;
}
	
.order-form-list .list .box{
	display: block;
}
	
.order-form-list .list {
	padding: 20px 0;
}
	
.order-form-list .list .form50{
	max-width: 100%;
}
.block-3 .block-3-inner .box img{
	margin-bottom: 5px;
}
.block-3 .block-3-inner p{
	font-size: 1.4em;
	font-weight: bold;
}
	
.present ul{
  display: block;
  margin: auto;
  width: 90%;
}

.present-img{
  display: block;
  margin: auto;
  max-width: 400px;
}
	
}

/*==========================
　　　　　  SP
==========================*/
@media screen and (max-width:480px){

header .header_row {
	box-sizing: border-box;
}
	
header .header_row2 {
	box-sizing: border-box;
	height: 200px;
	border-bottom: 1px #000000 solid;
}	
header .row-logos h1{
	font-size: 1.8em;
	letter-spacing: 5px;
}


header .row-logos-w h1{
	font-size: 1.8em;
	letter-spacing: 5px;
}
	
.blue-back {
	min-height: 70px;
	text-align: center;
	background: -moz-linear-gradient(top, #a1cbed, #d3edfb);
	background: -webkit-linear-gradient(top, #a1cbed, #d3edfb);
	background: linear-gradient(to bottom, #a1cbed, #d3edfb);
}

.blue-back h2 {
	vertical-align: middle;
	font-size: 1.8em
}	

.category-box .w-back{
	position: absolute;
	z-index: 100;
	top: 0;
	height: 30px;
	width: 100%;
	background-color: rgba( 255, 255, 255, 0.55 );
}

.category-box h3{
	font-size: 1.8em;
	position: absolute;
	z-index: 110;
	top:5px;
	left: 10px;
	height: 30px;
	-webkit-appearance:none;
}
	
.login-form{
  display: block;
  margin: 30px auto;
  width: 90%;
}

.order {
	margin: 30px auto;
}
	
.order-list {
	margin:10px auto;
}
	
.order-list .number{
	display: inline-block;
	width: 40px;
	height: 40px;
	text-align:center;
	line-height: 40px;
	border-radius: 50%;
	background:linear-gradient(#008cb4, #2ea7e0);
	color: #FFF;
	font-weight: bold;
	font-size: 1.4em;
	margin-top:10px;
}
	
.page-ttl2 h2 {
	font-size: 2.5em;
	letter-spacing: 0
}	

.order-form-list{
	display: table;
	width: 98%;
	table-layout:fixed;
	margin: auto;
	
}
.order-form-list .list .form50{
	max-width: 95%;
}
	
.mail-btn {
	margin:50px auto 0;
	padding: 10px 0px;
	display:block;
	width: 250px;
	text-align: center;
	border: none;
	text-decoration: none;
	outline: none;
	color: #FFF;
	border-radius:10px;
	font-size: 2.0em;
	font-weight: bold;
	background: #ea5514; /* Old browsers */
	-webkit-appearance:none;
}


.mail-btn:hover {
	background: #f5a200;
}

.mail-btn::before,
.mail-btn::after {
	position: absolute;
	z-index: -1;
	display: block;	
	content: '';
}
.mail-btn,
.mail-btn::before,
.mail-btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;	
}
.block-3 .block-3-inner .box img{
	margin-bottom: 3px;
}
.block-3 .block-3-inner p{
	font-size: 1.4em;
	font-weight: bold;
}
	
.start-btn{
  max-width: 200px;
}
	
}

@media screen and (max-width:391px){
header .header_row.index07  {
	box-sizing: border-box;
	height: 420px;
}	
	
header .header_row,header .header_row2  {
	box-sizing: border-box;
	height: 250px;
}

.button-wrap{
  display: block;
}	
.white-btn,
.red-btn{
width: 90%;
}	
	}

/* トップバナーのサイズ指定 */

@media print, screen and (min-width:1500px){
.top-img img.absolute{
	width: 1000px;
}
img.login07{
	width: 1000px;
}
}

@media print, screen and (max-width:1200px){
.top-img img.absolute{
	width: 800px;
}
img.login07{
	width: 800px;
}
}

@media print, screen and (max-width:1000px){
.top-img img.absolute{
	width: 500px;
}
img.login07{
	width: 500px;
}
}

@media print, screen and (max-width:800px){
.top-img img.absolute{
	width: 400px;
}
img.login07{
	width: 400px;
}
}	
@media print, screen and (max-width:799px){
.top-img img.absolute{
	width: 80%;
}
img.login07{
	width:  80%;
}	
}

@media print, screen and (max-width:650px){
.top-img img.absolute{
	width: 90%;
}
img.login07{
	width:  90%;
}	
}