@charset "utf-8";

/* ===================================================================

 style.css

=====================================================================*/

/* -------------------------------------------------------------------
 container-frame ///フレームテンプレート
---------------------------------------------------------------------*/

.container-frame {
	background-color:#f2f3ef;
}

.container-frame .main-contents{
	max-width:960px;
	margin:0 auto;
	padding:5.5em 1.3em 6em;
}

.container-frame  h1{
	text-align:left;
	font-size: 21px;
	padding:0.5em 0;
	font-weight:normal;
	margin-bottom: 20px;
}

@media only screen and (min-width: 670px){
	.container-frame .main-contents{
		max-width:960px;
		margin:0 auto;
	}
	.container-frame h1{
		font-size:30px;
	}
}

/* 白背景角丸枠 */
.white-frame {
	background-color:#fff;
	border-radius:5px;
	box-shadow:1px 1px 2px #ccc;
	padding:1.5em;
}

/* -------------------------------------------------------------------
 top
---------------------------------------------------------------------*/

/* -------------------
	main-visual
 -------------------*/

.top .mv-box {
	width: 100%;
	text-align: center;
	overflow: hidden;
	height: 300px;
	position: relative;
}

.top #pc-carousel {
	display: none !important;
}

.top #sp-carousel {
	display: block !important;
}

.top #sp-carousel .carousel-img {
	width: 100%;
	max-width: none;
	max-height: 600px;
	max-width: 640px;
	overflow: hidden;
	position: absolute;
	left: 0;
	margin-left: 0;
	display: block;
}

.top .bgimg {
	width: 100%;
	height: 100%;
	position:absolute;
	z-index: 1;
	background: url("/img/prelogin/img_main_01.jpg") no-repeat 50% 50%;
	background-attachment: scroll\9; /* for ie8*/
	background-size:cover;
	overflow: hidden;
}

.top .visual-cover {
	width: 100%;
	height: 300px;
	position: absolute;
	top: 3.5em;
	background: url("/img/prelogin/img_covered_texture.png") center center repeat;
	background-attachment: scroll\9; /* for ie8*/
	overflow:hidden;
	z-index:2;
}

.top .mv-box ul li {
	width: 100%;
	height: 300px;
	float: none !important;
	top: 0;
}

.top h1 {
	text-align:center;
	color:#fff;
	text-shadow:0 1px 2px #000;
}

.top .main-catch {
	font-size:2.0rem;
	padding: 1.7em 0 0 0;
	line-height: 1.25;
	font-weight: bold;
	display: block;
}

.top .main-catch .a {
	display:block;
}

.top .sub-catch {
	padding:1em 0 0 0;
	font-size:1.05rem;
	line-height: 0.8;
	margin-bottom: 30px;
	text-align:center;
	color:#fff;
	text-shadow:0 1px 2px #000;
}

.top .sub-catch p {
	margin-top: 5px;
}

.top .sub-catch .zero {
	font-size: 1.5rem;
}

.top .mv-btn-area {
	width: auto;
	max-width: 1260px;
	margin: 0 auto;
}

.top .mv-btn-area .sup-btn {
	width: 50%;
	text-align: center;
	float: left;
}

.top .mv-btn-area .buy-btn {
	width: 50%;
	text-align: center;
	float: right;
}

.top .mv-btn-area .btn-box {
	width: 120px;
	padding: 3px;
	background-color: #ffffff;
	border-radius: 5px;
	margin: 0 auto;
}
.top .mv-btn-area .btn-box .co-btn-l {
	font-size: 15px;
}
.top .mv-btn-area .btn-box .co-btn-l a {
	padding: 0px;
	font-weight: bold;
}

.top .mv-btn-area .opt-mv-btn-sup,
.top .mv-btn-area .opt-mv-btn-sup .text,
.top .mv-btn-area .opt-mv-btn-buy,
.top .mv-btn-area .opt-mv-btn-buy .text {
	display: none;
}

@media only screen and (min-width: 670px){

		.top .mv-box {
			height: 477px;
			overflow: hidden;
			margin: 0 auto;
		}

		.top #sp-carousel {
			display: none !important;
		}

		.top #pc-carousel {
			display: block !important;
		}

		.top #pc-carousel .carousel-img {
			width: 100%;
			max-width: none;
			min-height: 477px;
			min-width: 1336px;
			overflow: hidden;
			position: absolute;
			display: block;
		}

		.top #pc-carousel .carousel-img:first-child {
			display: block;
		}

		.top .bgimg {
			width: 100%;
			height: 100%;
			position:absolute;
			z-index: 1;
			background: url("/img/prelogin/img_main_01.jpg") no-repeat 50% 50%;
			background-attachment: scroll\9; /* for ie8*/
			background-size:cover;
			overflow: hidden;
		}

		.top .mv-box ul li {
			width: 100%;
			height: 477px;
			float: none !important;
			top: 0;
		}

		.top .visual-cover {
			height: 477px;
			position: absolute;
		}

		.top .contents-wrap{
			padding: 90px 0 1em;
		}

		.top h1 {
			font-size:14px;
		}

		.top .main-catch {
			font-size:2.9em;
			line-height:1;
			padding:0.2em 0;
			font-weight: normal;
		}

		.top .main-catch .a {
			display:inline;
		}

		.top .sub-catch {
			padding:0 0 0 0;
			font-size: 1.5em;
			font-weight: bold;
			margin-bottom: 65px;
		}

		.top .sub-catch p {
			display: inline;
		}

		.top .sub-catch .zero {
			font-size: 40px;
			font-weight: normal;
		}

		.top .mv-btn-area .btn-box {
			width: 180px;
		}
		.top .mv-btn-area .btn-box .co-btn-l {
			font-size: 18px;
		}
}

@media only screen and (min-width: 970px){
		.top .contents-wrap .box-a {
			width:100%;
			text-align:right;
		}

		.top .main-catch {
			font-size:3.5em;
				font-weight: normal;
		}

		.top .sub-catch {
			font-size:1.6em;
		}

		.top .mv-btn-area .btn-box {
			width: 215px;
		}
		.top .mv-btn-area .btn-box .co-btn-l {
			font-size: 21px;
		}
		.top .mv-btn-area .btn-box .co-btn-l a {
			font-weight: bold;
		}

		.top .mv-btn-area .sup-btn,
		.top .mv-btn-area .buy-btn {
			position: relative;
		}

		.top .mv-btn-area .opt-mv-btn-sup {
			background: url(/img/prelogin/bg_top_balloon_buy.png) no-repeat; 
			display: block;
			height: 115px;
			left: 50%;
			margin-left: -180px;
			position: absolute;
			top: -110px;
			width: 180px;
		}

		.top .mv-btn-area .opt-mv-btn-sup .text {
			display: block;
			font-size: 12px;
			font-size: 0.86rem;
			font-weight: bold;
			margin: 40px auto 0;
			width: 130px;
		}

		.top .mv-btn-area .opt-mv-btn-buy {
			background: url(/img/prelogin/bg_top_balloon_sup.png) no-repeat;
			display: block;
			height: 115px;
			left: 50%;
			position: absolute;
			top: -110px;
			width: 180px;
		}

		.top .mv-btn-area .opt-mv-btn-buy .text {
			display: block;
			font-size: 12px;
			font-size: 0.86rem;
			font-weight: bold;
			margin: 40px auto 0;
			width: 120px;
		}

}

@media only screen and (max-width: 1336px) {
	.top #pc-carousel .carousel-img {
		left: 50%;
		margin-left: -668px;
	}
}


/* -------------------
	news-area
 -------------------*/
.top .news-area {
	width: 100%;
	padding:0.8em 1em;
	box-sizing: border-box;
	font-size:13px;
	background-color:#f2f3ef;
	color:#4d4d4d;
	border-top:1px solid #eee;
	border-bottom:1px solid #eee;
}

.top .news-area .n-head {
	font-weight:bold;
}

.top .news-area .news-box {
	overflow: hidden;
	padding: 3px 5px 0;
}

.top .news-area ul {
	padding:0 0 0 1em;
}

.top .news-area li {
	padding:2px 0;
}

.top .news-area .n-list {
	text-align: right;
}

@media only screen and (min-width: 670px){
		.top .news-area {
			width: 630px;
			padding:0.8em 75px 0.8em 1em;
			margin: -70px auto 0;
			border-radius: 5px;
			position: relative;
			z-index: 3;
			box-sizing: border-box;
		}

		.top .news-area-inner {
			max-width:900px;
			margin: 0 auto;
			border-top:0;
			padding:0;
			position:relative;
		}

		.top .news-area .n-head {
			height:2.2em;
			text-align:center;
			line-height:2.3em;
			position:absolute;
			border-right:1px solid #ccc;
			padding-right:1em;
			width:45px;
		}

		.top .news-area .news-box {
			height: 1.8em;
			min-height:1.8em;
			line-height:1.8em;
			padding: 3px 5px 0;
			margin:0 0 0 55px;
		}

		.top .news-area .n-list a {
			background-color: #4d4d4d;
			color: #ffffff;
			width: 50px;
			text-align: center;
			border-radius: 5px;
			height: 1.8em;
			line-height: 1.8em;
			padding: 3px 5px 0;
			position:absolute;
			top:0;
			left:100%;
			border:1px solid #4d4d4d;
		}

		.top .news-area .n-list a:hover {
			opacity:0.7;
			text-decoration:none;
		}

		.top .news-area li {
			padding:0;
		}

		.top .news-area li a {
			display:inline-block;
			width:100%;
		}
}

@media only screen and (min-width: 970px){
		.top .news-area {
			width: 860px;
		}
}


/* -------------------
	whats-corec
 -------------------*/
.top .whats-corec {
   background-color:#fff;
   padding: 2.2em 1em 2em;
   text-align:center;
}

.top .whats-corec .a1 {
   display: block;
   font-size: 17px;
}

.top .whats-corec .a2 {
   display: block;
   font-weight: normal;
   text-align: left;
   margin: 6px 0;
   font-size: 15px;
   line-height: 1.4;
}

.top .whats-corec .a2 br {
   display: none;
}

.top .whats-corec h2 {
   font-size: 16px;
   line-height: 1.6;
   padding: 0;
   margin-bottom: 30px;
}


.top .whats-corec h2 + p {
   font-size: 16px;
   line-height: 1.6;
   padding: 0;
   margin-bottom: 30px;
}

.top .whats-corec li p {
	text-align:left;
	padding:0.4em 0 0;
}

.top .whats-corec li p.summary {
	text-align:center;
	font-size:15px;
}

.top .whats-corec li img {
	padding:10%;
	width:80%;
	background-color:#fafafa;
}

@media only screen and (min-width: 670px){
		.top .whats-corec {
			padding: 5.3em 3em;
		}

		.top .whats-corec .a1 {
			line-height: 1;
			margin-bottom: 30px;
			font-size: 30px;
			font-size: 2.14rem;
		}

		.top .whats-corec .a2 {
			font-size: 19px;
			font-size: 1.35rem;
			text-align: center;
		}

		.top .whats-corec .a2 br {
		   display: block;
		}

		.top .whats-corec h2 {
			margin-bottom: 35px;
			font-weight: normal;
		}

		.top .whats-corec ul {
			margin:0 auto;
			max-width:970px;
			padding:2em 0 0;
		}
}


/* -------------------
	achievement
 -------------------*/

.top .achievement {
	background:#90c320 url("/img/prelogin/bg_top_building.jpg") center center no-repeat;
	background-attachment: scroll\9; /* for ie8*/
	background-size: cover;
	overflow: hidden;
	height: 540px;
}

.top .achievement p {
	text-align: center;
	color: #ffffff;
	font-size: 1.5rem;
	padding-top: 30px;
	line-height: 1;
}

.top .achievement p span {
	display: block;
	font-size: 17px;
	margin-bottom: 10px;
	font-weight: bold;
}

.top .achievement p span span {
	font-size: 2rem;
	display: inline;
	margin: 0 2px;
}

.top .achievement ul {
	width: auto;
	margin: 30px 12px;
}

.top .achievement li {
	width: 50%;
	float: left;
	color: #ffffff;
	text-align: center;
}

.top .achievement li div {
	width: 116px;
	margin: 0 auto;
}

.top .achievement li div img {
	width: 65px;
}

.top .achievement li .genre {
	border-top: 2px solid #ffffff;
	border-bottom: 2px solid #ffffff;
	margin-top: 10px;
	padding: 7px 0;
	font-size: 0.88rem;
	font-weight: bold;
}

.top .achievement .icon.odd,
.top .achievement .icon.even {
	margin-bottom: 30px;
}

 @media only screen and (min-width: 670px){
		.top .achievement {
			background:#90c320 url("/img/prelogin/bg_top_building.jpg") center center no-repeat;
			background-attachment: scroll\9; /* for ie8*/
			background-size: cover;
			overflow: hidden;
			height: 545px;
		}

		.top .achievement p {
			font-size: 21px;
			font-size: 1.5rem;
			padding-top: 60px;
		}

		.top .achievement p span {
			display: inline;
			font-size: 30px;
			font-size: 2.14rem;
			font-weight: normal;
		}

		.top .achievement p span span {
			font-size: 40px;
			font-size: 2.85rem;
		}

		.top .achievement ul {
			width: auto;
			max-width: 1070px;
			margin: 40px auto 0;
		}

		.top .achievement li {
			width: 33%;
		}

		.top .achievement li div {
			width: 180px;
		}

		.top .achievement li div img {
			width: 95px;
		}

		.top .achievement li .genre {
			font-size: 1rem;
		}

		.top .achievement .icon:nth-child(1),
		.top .achievement .icon:nth-child(2),
		.top .achievement .icon:nth-child(3) {
			padding-bottom: 20px;
		}

		.top .achievement .icon.odd {
			margin-bottom: 20px;
		}

		.top .achievement .icon.even {
			margin-top: 20px;
			margin-bottom: 0;
		}
 }


 @media only screen and (min-width: 970px){
		.top .achievement {
			height: 395px;
		}

		.top .achievement p {
			font-size: 2.14rem;
		}

		.top .achievement p span {
			display: inline;
			font-size: 2.15rem;
		}

		.top .achievement p span span {
			font-size: 4.01rem;
		}

		.top .achievement ul {
			width: auto;
			max-width: 1070px;
			margin: 40px auto 0;
		}

		.top .achievement li {
			width: 16.6% !important;
			float: left;
			color: #ffffff;
			text-align: center;
			padding-bottom: 0 !important;
		}

		.top .achievement li div {
			width: 145px;
			margin: 0 auto;
		}

		.top .achievement li .genre {
			border-top: 3px solid #ffffff;
			border-bottom: 3px solid #ffffff;
			margin-top: 15px;
			padding: 10px 0;
			font-size: 15px;
			font-weight: bold;
			line-height:1;
		}
 }



/* -------------------
	howto-use
 -------------------*/
.top .howto-use {
   background-color:#fff;
   padding:2em 0 6em;
   text-align:center;
}

.top .howto-use h2 {
   font-size: 17px;
   line-height: 1.6;
   padding: 0;
   margin-bottom: 20px;
}

.top .howto-use .sup-box {
	width: 90%;
	float: none;
	margin: 0 auto;
}

.top .howto-use .buy-box {
	width: 90%;
	float: none;
	margin: 30px auto 0;
}

.top .howto-use h3 {
   font-size: 0.92rem;
   font-weight: bold;
   line-height: 2;
   border-radius: 10px;
   color: #ffffff;
}

.top .howto-use h3 img {
	margin: -4px 10px 0 0;
	width: 40px;
}

.top .howto-use .sup-box h3 {
	background-color: #85c9ed;
}

.top .howto-use .buy-box h3 {
	background-color: #df920b;
}

.top .howto-use h3 img.icon {
   border:0;
   background: none;
   width: 22px;
   padding: 0;
   margin-right: 8px;
   vertical-align: top;
}

.top .howto-use ol {
	width: 100%;
	list-style: none;
	display: table;
}

.top .howto-use li {
	height: 100px;
	display: table-row;
	text-align: left;
	font-size: 0.92rem;
}

.top .howto-use li div {
	vertical-align: middle;
	width: 100%;
	display: table-cell;
	position: relative;
	background-position: 100% 50%;
	background-repeat: no-repeat;
}

.top .howto-use li div img {
	width: 35px;
	height: 35px;
}

.top .howto-use .sup-box li.step1 div {
	background-image: url(/img/prelogin/img_receive_step_01.png);
	background-image: url(/img/prelogin/img_receive_step_01_s.png)\9 /* ie8 */;
	background-size: 95px;
}

.top .howto-use .sup-box li.step2 div {
	background-image: url(/img/prelogin/img_receive_step_02.png);
	background-image: url(/img/prelogin/img_receive_step_02_s.png)\9 /* ie8 */;
	background-size: 75px;
	background-position: 95% 25px;
}

.top .howto-use .sup-box li.step3 div {
	background-image: url(/img/prelogin/img_receive_step_03.png);
	background-image: url(/img/prelogin/img_receive_step_03_s.png)\9 /* ie8 */;
	background-size: 95px;
}

.top .howto-use .sup-box li.step3 div:before {
	content: "";
	position: absolute;
	bottom: -11px;
	left: 50%;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-top: 10px solid #85c9ed;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
}

.top .howto-use .sup-box li.step3 div:after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-top: 10px solid #ffffff;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
}

.top .howto-use .sup-box li div {
	border-bottom: solid 1px #85c9ed;
}

.top .howto-use .sup-box li.step2 div span {
	position: absolute;
	top:32px;
	left: 38px;
}

.top .howto-use .sup-box li.step3 div span {
	position: absolute;
	top: 32px;
	left: 38px;
}

.top .howto-use .buy-box li.step1 div {
	background-image: url(/img/prelogin/img_order_step_01.png);
	background-image: url(/img/prelogin/img_order_step_01_s.png)\9 /* ie8 */;
	background-size: 90px;
}

.top .howto-use .buy-box li.step2 div {
	background-image: url(/img/prelogin/img_order_step_02.png);
	background-image: url(/img/prelogin/img_order_step_02_s.png)\9 /* ie8 */;
	background-size: 75px;
	background-position: 96% 25px;
}

.top .howto-use .buy-box li.step3 div {
	background-image: url(/img/prelogin/img_order_step_03.png);
	background-image: url(/img/prelogin/img_order_step_03_s.png)\9 /* ie8 */;
	background-size: 75px;
	background-position: 96% 25px;
}

.top .howto-use .buy-box li.step3 div:before {
	content: "";
	position: absolute;
	bottom: -11px;
	left: 50%;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-top: 10px solid #df920b;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
}

.top .howto-use .buy-box li.step3 div:after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -20px;
	width: 0;
	height: 0;
	border-top: 10px solid #ffffff;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
}

.top .howto-use .buy-box li div {
	border-bottom: solid 1px #df920b;
}

.top .howto-use .buy-box li.step2 div span {
	position: absolute;
	top: 32px;
	left: 38px;
}

.top .howto-use .buy-box li.step3 div span {
	position: absolute;
	top: 32px;
	left: 38px;
}

.top .howto-use li div span {
	margin-left: 5px;
	display: inline-block;
}

.top .howto-use .sup-box ol + p {
	margin: 30px 0 20px;
	font-weight: bold;
	font-size: 16px;
	color: #70b8df;
	line-height: 1;
}

.top .howto-use .buy-box ol + p {
	margin: 30px 0 20px;
	font-weight: bold;
	font-size: 16px;
	color: #df920b;
	line-height: 1;
}

.top .howto-use ol + p + div {
	padding: 15px 20%;
	border-radius: 10px;
}

.top .howto-use ol + p + div .co-btn-l {
	font-size: 1em;
	line-height: 40px;
}

.top .howto-use ol + p + div .co-btn-l a {
	height: 40px;
}

.top .howto-use .sup-box ol + p + div {
	background-color: #cee9f8;
}

.top .howto-use .buy-box ol + p + div {
	background-color: #f5deb5;
}


@media only screen and (min-width: 670px){
		.top .howto-use {
			padding:4.3em 3% 140px;
		}

		.top .howto-use h2 {
			display: block;
			line-height: 1;
			margin-bottom: 60px;
			font-size: 30px;
			font-size: 2.14rem;
			font-weight: normal;
		}

		.top .howto-use h2 + div {
			 width: auto;
			 max-width: 1040px;
			 margin: 0 auto;
		}

		.top .howto-use .sup-box {
			width: 600px;
		}

		.top .howto-use .buy-box {
			width: 600px;
			margin: 60px auto 0;
		}

		.top .howto-use h3 {
		   font-size: 19px;
		   font-weight: bold;
		   line-height: 2.36;
		   border-radius: 20px;
		   color: #ffffff;
		}

		.top .howto-use h3 img {
			margin: -10px 10px 0 0;
			width: 54px;
		}

		.top .howto-use h3 img.icon {
		   width: 26px;
		}

		.top .howto-use ol {
			display: table;
		}

		.top .howto-use li {
			height: 160px;
			font-size: 1.25rem;
		}

		.top .howto-use li div {
			vertical-align: middle;
			width: 600px;
			display: table-cell;
			position: relative;
			background-position: 100% 50%;
			background-repeat: no-repeat;
		}

		.top .howto-use li div img {
			width: 70px;
			height: 70px;
		}

		.top .howto-use .sup-box li.step1 div {
			background-size: 175px;
		}

		.top .howto-use .sup-box li.step2 div {
			background-size: 134px;
			background-position: 95% 18px;
		}

		.top .howto-use .sup-box li.step3 div {
			background-size: 175px;
		}

		.top .howto-use .sup-box li.step2 div span br,
		.top .howto-use .sup-box li.step3 div span br {
			display: none;
		}

		.top .howto-use .sup-box li.step3 div:before {
			bottom: -15px;
			margin-left: -25px;
			border-top: 15px solid #85c9ed;
			border-left: 25px solid transparent;
			border-right: 25px solid transparent;
		}

		.top .howto-use .sup-box li.step3 div:after {
			bottom: -13px;
			margin-left: -25px;
			border-top: 15px solid #ffffff;
			border-left: 25px solid transparent;
			border-right: 25px solid transparent;
		}

		.top .howto-use .sup-box li div {
			border-bottom: solid 2px #85c9ed;
		}

		.top .howto-use .sup-box li.step2 div span,
		.top .howto-use .sup-box li.step3 div span {
			top: 70px;
			left: 74px;
		}

		.top .howto-use .buy-box li.step1 div {
			background-size: 170px;
		}

		.top .howto-use .buy-box li.step2 div {
			background-size: 132px;
		}

		.top .howto-use .buy-box li.step3 div {
			background-size: 140px;
		}

		.top .howto-use .buy-box li.step2 div span br {
			display: none;
		}

		.top .howto-use .buy-box li.step3 div:before {
			bottom: -15px;
			margin-left: -25px;
			border-top: 15px solid #df920b;
			border-left: 25px solid transparent;
			border-right: 25px solid transparent;
		}

		.top .howto-use .buy-box li.step3 div:after {
			bottom: -13px;
			margin-left: -25px;
			border-top: 15px solid #ffffff;
			border-left: 25px solid transparent;
			border-right: 25px solid transparent;
		}

		.top .howto-use .buy-box li div {
			border-bottom: solid 2px #df920b;
		}

		.top .howto-use .buy-box li.step2 div span {
			position: absolute;
			top: 70px;
			left: 74px;
		}

		.top .howto-use .buy-box li.step3 div span {
			position: absolute;
			top: 60px;
			left: 74px;
		}

		.top .howto-use .sup-box ol + p {
			margin: 35px 0;
			font-size: 20px;
		}

		.top .howto-use .buy-box ol + p {
			margin: 35px 0;
			font-size: 20px;
		}

		.top .howto-use .sup-box ol + p + div {
			padding: 25px 180px;
		}

		.top .howto-use .buy-box ol + p + div {
			padding: 25px 180px;
		}

		.top .howto-use ol + p + div .co-btn-l {
			font-size: 1.21rem;
		}

}


@media only screen and (min-width: 970px){
		.top .howto-use h3 {
		   font-size: 17px;
		}

	.top .howto-use .sup-box {
			width: 48%;
			max-width: 480px;
			float: left;
			margin: 0 auto;
		}

		.top .howto-use .buy-box {
			width: 48%;
			max-width: 480px;
			float: right;
			margin: 0 auto;
		}
		.top .howto-use li span {
		  font-size: 1rem;
		}
		.top .howto-use li div {
			vertical-align: middle;
			width: 100%;
			max-width: 480px;
			display: table-cell;
			position: relative;
			background-position: 100% 50%;
			background-repeat: no-repeat;
		}

		.top .howto-use li div span {
			font-size: 1.07rem;
		}

		.top .howto-use .sup-box ol + p + div {
			padding: 25px 110px;
		}

		.top .howto-use .buy-box ol + p + div {
			padding: 25px 110px;
		}
}

/* -------------------
	fadeimg
 -------------------*/
.top .fadeimg {
	position: relative;
	list-style: none;
	overflow: hidden;
	width: 100%;
	padding: 0;
	margin: 0 auto;
}

.top .fadeimg li {
	-webkit-backface-visibility: hidden;
	position: absolute;
	display: none;
	width: 100%;
	left: 0;
	top: 0;
	z-index:0 !important;
}

.top .fadeimg li:first-child {
	position: relative;
	display: block;
	float: left;
}

.top .fadeimg img {
	display: block;
	height: auto;
	float: left;
	width: 100%;
	border: 0;
}

.top #fadeNaviBuy,
.top #fadeNaviSup {
	display:none;
}

@media only screen and (min-width: 670px){
		.top #fadeNaviBuy,
		.top #fadeNaviSup {
			display:block;
		}

		.top .fadeimg_tabs {
			margin:2em auto 1em;
			clear:both;
			overflow:hidden;
		}

		.top .fadeimg_tabs li {
			display:inline-block;
			padding:10px 0 12px;
			font-size:18px;
		}

		.top .fadeimg_tabs li a {
			line-height:20px;
			margin-left:10px;
			background-color:#fff;
			padding:4px 12px;
		}

		.top .fadeimg_tabs li a:hover {
			text-decoration:none;
		}

		.top .fadeimg_tabs li:first-child a {
			margin-left:0;
		}

		.top .fadeimg1_tabs li a {
			border:1px solid #df920b;
			color:#df920b;
		}

		.top .fadeimg1_tabs .fadeimg_here {
			background:url("/img/prelogin/bg_bottomguide_buy01.png") center bottom no-repeat;
		}

		.top .fadeimg2_tabs .fadeimg_here {
			background:url("/img/prelogin/bg_bottomguide_sup01.png") center bottom no-repeat;
		}

		.top .fadeimg1_tabs .fadeimg_here a {
			background-color:#df920b;
			color:#fff;
		}

		.top .fadeimg2_tabs li a {
			border:1px solid #85c9ed;
			color:#67aadd;
		}

		.top .fadeimg2_tabs .fadeimg_here a {
			background-color:#85c9ed;
			color:#fff;
		}
}


/* -------------------------------------------------------------------
 buyer
---------------------------------------------------------------------*/

/* -------------------
	main-visual
 -------------------*/
.buyer .main-visual {
	background: url("/img/prelogin/bg_main-v_buy.jpg") center center no-repeat;
	background-attachment: scroll\9; /* for ie8*/
	background-size:cover;
	overflow: hidden;
	height: 336px;
	position: relative;
}

.buyer .visual-cover {
	width: 100%;
	height: 336px;
	position: relative;
	margin: 0 auto;
}

.buyer .visual-cover img {
	width: 80%;
	margin-left: -40%;
}

.buyer .visual-cover + div {
	width: 100%;
	height: 20px;
	position: absolute;
	bottom: 0;
	overflow: hidden;
}

.buyer .visual-cover + div .arrow-l {
	width: 50%;
	height: 20px;
	float: left;
	margin-left: -34px;
	background-color: #e6a32f;
}

.buyer .visual-cover + div .arrow {
	width: 68px;
	height: 20px;
	float: left;
	background-image: url(/img/prelogin/img_mv-cover_buy.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}

.buyer .visual-cover + div .arrow-r {
	width: 50%;
	height: 20px;
	float: right;
	margin-right: -34px;
	background-color: #e6a32f;
}

.buyer .visual-cover .mv-buy {
	position: absolute;
	bottom: -4%;
	left: 50%;
}

.buyer .text-wrap {
	position: relative;
	z-index: 10;
}

.buyer .login-btn .login-box,
.buyer .login-btn .login-btn-inner {
	display:none;
}

.buyer h1 {
	font-size: 1.71rem;
	padding:1.5em 0.5em 0;
	margin:0 auto;
	line-height: 1.2;
	text-align: center;
	text-shadow: 0 0px 4px #fff;
}

.buyer h1 .str {
	font-size: 1.85rem;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 10px;
	display: block;
}

.buyer h1 + p  {
	padding: 0 0.9em;
}

.buyer h1 + p .a {
	font-size: 1.28rem;
	margin-top: 5px;
	display: block;
	line-height: 1;
	text-shadow: 0 0px 4px #fff;
	text-align: center;
}

.buyer .text-wrap .signup-btn {
	padding:1em 0 0;
	width:13em;
	margin: 20px auto 0;
	padding: 3px;
	background-color: #ffffff;
	border-radius: 5px;
}

.buyer .container {
	background-color:#fff;
}

.buyer h2 {
	font-size: 2.14rem;
	color: #4d4d4d;
	text-align: center;
	font-weight: normal;
	line-height: 1;
}

@media only screen and (min-width: 375px){
		.buyer .main-visual {
			overflow: hidden;
			height: 370px;
		}

		.buyer .visual-cover {
			max-width: 1366px;
			height: 370px;
		}

		.buyer .visual-cover .mv-buy {
			bottom: -2%;
		}

		.buyer .visual-cover img {
			position: absolute;
			top: auto;
			bottom: -2%;
			right: 5%;
			left: 50%;
			margin-left: -150px;
			width: 300px;
		}
}

@media only screen and (min-width: 670px){
		.buyer .main-visual {
			overflow: hidden;
			height: 346px;
		}

		.buyer .visual-cover {
			max-width: 1366px;
			height: 346px;
		}

		.buyer .visual-cover img {
			max-width: 510px;
			width: 55%;
		}

		.buyer .visual-cover + div {
			height: 30px;
		}

		.buyer .visual-cover + div .arrow-l {
			height: 30px;
			margin-left: -50px;
		}
		
		.buyer .visual-cover + div .arrow {
			width: 100px;
			height: 30px;
		}

		.buyer .visual-cover + div .arrow-r {
			height: 30px;
			margin-right: -50px;
		}

		.buyer .visual-cover .mv-buy {
			position: absolute;
			top: auto;
			bottom: 0;
			right: 5%;
			left: auto;
		}

		.buyer .text-wrap {
			position: absolute;
			left: 5%;
			top: 65px;
			z-index: 0;
		}

		.buyer h1 {
			text-align: left;
		}

		.buyer h1 .str {
			margin-bottom: 20px;
			font-size: 2.5rem;
			line-height: 1;
		}

		.buyer h1 + p .a {
			  font-size: 1.5rem;
			  line-height: 1.3;
			  text-align: left;
		}

		.buyer .text-wrap .signup-btn {
			margin: 20px 0.9em 0;
		}

		.buyer .login-btn .login-box,
		.buyer .login-btn .login-btn-inner {
			display:block;
		}
}

@media only screen and (min-width: 970px){
		.buyer .main-visual {
			height: 517px;
		}

		.buyer .visual-cover {
			position: relative;
			height: 517px;
		}

		.buyer .visual-cover img {
			max-width: 783px;
			width: 60%;
		}

		.buyer .visual-cover + div {
			height: 40px;
		}

		.buyer .visual-cover + div .arrow-l {
			width: 50%;
			height: 40px;
			margin-left: -67px;
		}

		.buyer .visual-cover + div .arrow {
			width: 134px;
			height: 40px;
			float: left
		}

		.buyer .visual-cover + div .arrow-r {
			width: 50%;
			height: 40px;
			margin-right: -67px;
		}

		.buyer .visual-cover .mv-buy {
			position: absolute;
			bottom: 0;
			right: 5.0%;
		}

		.buyer .text-wrap {
			position: absolute;
			left: 4%;
			top: 125px;
		}

		.buyer h1 {
			line-height: 1.6;
			text-align: left;
			padding: 0;
			font-size: 2.36rem;
		}

		.buyer h1 .str {
			margin-bottom: 20px;
			font-size: 35px;
			font-size: 2.5rem;
			line-height: 1;
		}

		.buyer h1 .str span {
			font-size: 52px;
			font-size: 3.7rem;
			font-weight: bold;
		}

		.buyer h1 + p  {
			padding: 0;
		}

		.buyer h1 + p .a {
			font-size: 26px;
			font-size: 1.85rem;
			line-height: 1.3;
		}

		.buyer .text-wrap .signup-btn {
			font-size: 20px;
			line-height: 52px;
			margin: 35px 0 0 5px;
			vertical-align: bottom;
		}

		.buyer .text-wrap .signup-btn a {
			height:50px;
		}
}

@media only screen and (min-width: 1280px){
		.buyer .visual-cover img {
			max-width: 783px;
			width: 100%;
		}

		.buyer .visual-cover .mv-buy {
			right: 6.0%;
		}

		.buyer .text-wrap {
			top: 105px;
		}

		.buyer h1 .str {
			margin-bottom: 20px;
			font-size: 2.93rem;
			line-height: 1;
		}

		.buyer h1 str span {
			font-size: 3.93rem;
			font-weight: bold;
		}
		.buyer h1 + p .a {
			  font-size: 2.12rem;
			  line-height: 1.4;
		}
}


/* -------------------
	intro
-------------------- */
.buyer .intro {
	text-align: center;
	background-color: #e6a32f;
}

.buyer .intro .inner {
	margin: 0 auto 0;
	padding: 1em 0 4.6em;
	position: relative;
}

.buyer .intro .inner h2 {
	margin: 0.88em 0 1.7em;
	font-size: 1.42rem;
	color: #ffffff;
}

.buyer .intro .inner ul {
	list-style: none;
	margin: 0 auto;
}

.buyer .intro .inner > ul > li {
	margin-top: 40px;
}

.buyer .intro .inner > ul > li:first-child {
	margin-top: 0;
}

.buyer .intro .inner > ul > li > div {
	width: 205px;
	height: 205px;
	background-color: #f3f2ef;
	border-radius: 50%;
}

.buyer .intro .inner .form-create {
	margin: 0 auto;
}

.buyer .intro .inner .form-invite {
	margin: 0 auto;
}

.buyer .intro .inner .form-manage {
	margin: 0 auto;
}

.buyer .intro .inner .form-create img {
	margin: 10px 0 0 5px;
	width: 108px;
}

.buyer .intro .inner .form-invite img {
	margin: -10px 0 0 50px;
	width: 130px;
}

.buyer .intro .inner .form-manage img {
	margin: -2px 0 0 10px;
	width: 130px;
}

.buyer .intro .inner p {
	margin-top: 8px;
	font-size: 1.07rem;
}

.buyer .intro .inner .marker {
	font-weight: bold;
	/* IE 8+ */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f2ef', endColorstr='#ffff00', GradientType=0)";
	/* IE 10 */
	background: -ms-linear-gradient(#f3f2ef 40%, #ffff00 60%);
	background: -webkit-linear-gradient(top,#f3f2ef 40%, #ffff00 60%);
	background: linear-gradient(to bottom #f3f2ef 40%, #ffff00 60%);

}


@media only screen and (min-width: 670px){
		.buyer .intro .inner h2 {
			font-size: 30px;
			font-size: 2.14rem;
		}

		.buyer .intro .inner {
			width: 90%;
			max-width: 1366px;
		}

		.buyer .intro .inner ul {
			max-width: 960px;
		}

		.buyer .intro .inner ul li {
			width: 33.3%;
			float: left;
			margin-top: 0;
		}

		.buyer .intro .inner .form-create {
			margin: 0 auto 0 0;
		}

		.buyer .intro .inner .form-manage {
			margin: 0 0 0 auto;
		}

}

@media only screen and (min-width: 970px){
		.buyer .intro .inner > ul > li > div {
			width: 270px;
			height: 270px;
		}

		.buyer .intro .inner li div div {
			height: 170px;
		}

		.buyer .intro .inner .form-create img {
			margin: 15px 0 0 5px;
			width: 137px;
		}

		.buyer .intro .inner .form-invite img {
			margin: -20px 0 0 60px;
			width: 160px;
		}

		.buyer .intro .inner .form-manage img {
			margin: -5px 0 0 10px;
			width: 162px;
		}

		.buyer .intro .inner p {
			font-size: 17px;
			font-size: 1.21rem;
		}
}

/* -------------------
	order-step
-------------------- */

.buyer .order-step {
	text-align: center;
	background-color: #f3f2ef;
	padding: 60px 0;
}

.buyer .order-step h2 {
	font-size: 1.42rem;
	margin-bottom: 45px;
}

.buyer .order-step .inner {
	margin: 0 auto;
	position: relative;
}

.buyer .order-step .inner ol {
	list-style: none;
}

.buyer .order-step .inner .step {
	margin-bottom: 50px;
}

.buyer .order-step .inner .step .image {
	margin-top: 20px;
}

.buyer .order-step .inner .step1 .image {
	width: 170px;
}

.buyer .order-step .inner .step2 .image {
	width: 132px;
}

.buyer .order-step .inner .step3 .image {
	width: 140px;
}

.buyer .order-step .inner .step div {
	width: 70%;
	max-width: 450px;
	height: auto;
	position: relative;
	text-align: center;
	padding: 15px;
	box-sizing: border-box;
	background-color: #ffffff;
	border-radius: 10px;
	margin: 0 auto;
}

.buyer .order-step .inner .step div p {
	margin-top: 15px;
	font-size: 15px;
	font-size: 1.07rem;
}

.buyer .order-step .inner .step div p span {
	display: block;
}

.buyer .order-step .inner .step div br {
	display: none;
}

.buyer .order-step .inner .step div:after {
	content: url("/img/prelogin/icon_gt_buy_bottom.png");
	position: absolute;
	top: 107%;
	left: 50%;
	margin-left: -16px;
}

.buyer .order-step .inner .step .icon {
	position: absolute;
	width: 50px;
	top: -20px;
	left: -15px;
}

.buyer .order-step .inner .last-step div {
	width: 140px;
	height: 140px;
	margin: 0 auto;
	border-radius: 50%;
	font-size: 20px;
	font-weight: bold;
	background-color: #df920b;
	color: #ffffff;
	line-height: 140px;
}

@media only screen and (min-width: 670px){
		.buyer .order-step {
			padding: 70px 0;
		}

		.buyer .order-step h2 {
			font-size: 30px;
			font-size: 2.14rem;
			margin-bottom: 65px;
		}

		.buyer .order-step .inner .step div {
			height: auto;
		}

		.buyer .order-step .inner .step div p {
			margin-top: 15px 0 10px;
		}

		.buyer .order-step .inner .step div p span {
			display: inline;
		}

		.buyer .order-step .inner .step .icon {
			width: 70px;
		}
}

@media only screen and (min-width: 970px){
		.buyer .order-step .inner {
			max-width: 1110px;
		}

		.buyer .order-step .inner ol {
			margin-left: 30px;
		}

		.buyer .order-step .inner .step {
			width: 28%;
			float: left;
			box-sizing: border-box;
			margin: 0 auto;
		}

		.buyer .order-step .inner .last-step {
			width: 13%;
			float: left;
		}

		.buyer .order-step .inner .step div {
			min-width: 190px;
			height: 15.7rem;
			margin: 0 auto 0 0;
		}

		.buyer .order-step .inner .step.step1 .image {
			margin-top: 15px;
		}

		.buyer .order-step .inner .step.step2 .image {
			margin-top: 35px;
		}

		.buyer .order-step .inner .step.step3 .image {
			margin-top: 35px;
		}

		.buyer .order-step .inner .step.step1  div p {
			margin-top: 25px;
		}

		.buyer .order-step .inner .step div br {
			display: block;
		}

		.buyer .order-step .inner .step div:after {
			content: url("/img/prelogin/icon_gt_buy.png");
			position: absolute;
			top: 50%;
			left: 123%;
			margin-top: -17px;
		}

		.buyer .order-step .inner .step .icon {
			position: absolute;
			top: -20px;
			left: -15px;
		}

		.buyer .order-step .inner .last-step div {
			margin: 42px 0 0 auto;
		}
		.buyer .order-step .inner p {
			font-size: 1.07rem;
		}
}

/* -------------------
	useful-func
-------------------- */
.buyer .useful-func {
	text-align: center;
	background-color: #ffffff;
	padding: 60px 0;
}

.buyer .useful-func h2 {
	font-size: 1.42rem;
	margin-bottom: 30px;
	line-height: 1.2;
}

.buyer .useful-func h2 span {
	display: block;
}

.buyer .useful-func .inner {
	margin: 0 auto;
	position: relative;
	width: 90%;
}

.buyer .useful-func .inner ul {
	list-style: none;
}

.buyer .useful-func .inner ul li {
	margin-bottom: 45px;
}

.buyer .useful-func .inner ul li:last-child {
	margin-bottom: 0;
}

.buyer .useful-func .inner ul li > div {
	width: 90%;
}

.buyer .useful-func .inner ul li .box1 div img
 {
	width: 107px;
}

.buyer .useful-func .inner ul li .box2 div img {
	width: 71px;
}

.buyer .useful-func .inner ul li .box3 div img {
	width: 80px;
}

.buyer .useful-func .inner ul li .box4 div img {
	width: 84px;
}

.buyer .useful-func .inner ul li .box5 div img {
	width: 95px;
}

.buyer .useful-func .inner ul li .box6 div img {
	width: 90px;
}

.buyer .useful-func .inner ul li div {
	margin: 0 auto;
}

.buyer .useful-func .inner ul li > div > div {
	margin-bottom: 25px;
}

.buyer .useful-func .inner ul li h3 {
	margin: 0 auto 10px;
	font-size: 1.21rem;
	color: #df920b;
}

.buyer .useful-func .inner ul li h3 span {
	display: block;
	line-height: 1.2;
}

.buyer .useful-func .inner ul li h3 img {
	width: 55px;
	margin: -5px 0 0 6px;
}

.buyer .useful-func .inner ul li p {
	text-align: left;
	font-size: 1rem;
}

@media only screen and (min-width: 670px){
		.buyer .useful-func {
			padding: 70px 0 10px;
		}

		.buyer .useful-func h2 {
			font-size: 30px;
			font-size: 2.14rem;
			margin-bottom: 50px;
		}

		.buyer .useful-func h2 span {
			display: inline;
		}

		.buyer .useful-func .inner ul li {
			width: 50%;
			height: 210px;
			height: 15rem;
			float: left;
			margin-bottom: 30px;
		}

		.buyer .useful-func .inner ul li:last-child {
			margin-bottom: 30px;
		}

		.buyer .useful-func .inner ul li > div {
			max-width: 280px;
		}

		.buyer .useful-func .inner ul li div {
			margin: 0 auto;
		}

		.buyer .useful-func .inner ul li > div > div {
			height: 110px;
			margin-bottom: 0;
		}

		.buyer .useful-func .inner ul li h3 {
			margin: 5px auto 10px;
			font-size: 1.21rem;
		}

		.buyer .useful-func .inner ul li h3 span {
			display: inline;
		}

		.buyer .useful-func .inner ul li p {
			text-align: left;
			font-size: 1rem;
		}
}

@media only screen and (min-width: 970px){
		.buyer .useful-func {
			padding: 70px 0 35px;
		}

		.buyer .useful-func .inner {
			width: 98%;
			max-width: 1070px;
		}

		.buyer .useful-func .inner ul {

		}

		.buyer .useful-func .inner ul li {
			width: 33.3%;
		}

		.buyer .useful-func .inner ul li > div {
			min-width: 310px;
		}

		.buyer .useful-func .inner ul li .box1,
		.buyer .useful-func .inner ul li .box4
		 {
			margin: 0 auto 0 0;
		}

		.buyer .useful-func .inner ul li .box2,
		.buyer .useful-func .inner ul li .box5 {
			margin: 0 auto;
		}

		.buyer .useful-func .inner ul li .box3,
		.buyer .useful-func .inner ul li .box6 {
			margin: 0 0 0 auto;
		}

		.buyer .useful-func .inner ul li > div > div {
			height: 100px;
		}

		.buyer .useful-func .inner ul li h3 {
			margin: 0 auto 20px;
			font-size: 19px;
			font-size: 1.35rem;
		}

		.buyer .useful-func .inner ul li .box4 h3,
		.buyer .useful-func .inner ul li .box5 h3,
		.buyer .useful-func .inner ul li .box6 h3 {
			margin-top: 13px;
		}

		.buyer .useful-func .inner ul li p {
			font-size: 15px;
			font-size: 1.07rem;
		}

}


/* -------------------
	questions
-------------------- */
@media screen and (max-width: 670px) {
	.buyer .questions {
		text-align: center;
		background-color: #df920b;
		padding: 40px 0;
		color:#ffffff;
	}
	.buyer .questions h2 {
		font-size: 1.6rem;
		margin-bottom: 40px;
		color: #ffffff;
	}
	.buyer .questions h2 span {
		display: inline-block;
	}
	.buyer .questions .inner {
		margin: 0 auto;
		width:90%;
		max-width:auto;
	}
	.buyer .questions .inner ul {
		margin:0 auto;
		width:100%;
	}
	.buyer .questions .inner ul li {
		margin-bottom: 20px;
	}
	.buyer .questions .inner ul li .question {
		width:100%;
		float:left;
		position: relative;
	}
	.buyer .questions .inner ul li .question .num {
		border:#ffffff 2px solid;
		padding:4px 8px;
		float:left;
		font-size:1.1rem;
		position: absolute;
	}
	.buyer .questions .inner ul li .question p {
		float:left;
		padding:0 10px 0.5% 10px;
		font-size: 1.1rem;
		font-weight:bold;
		text-align:left;
		margin-left:14%
	}
	.buyer .questions .inner ul li .answer {
		float:left;
		background-color:#ffffff;
		color:#4d4d4d;
		text-align:left;
		width:100%;
		border-radius: 5px;
		margin-top:5%;
	}
	.buyer .questions .inner ul li .answer p {
		float:left;
		padding:15px 15px;
		font-size:1.08rem;
		position: relative;
	}
	.buyer .questions .inner ul li .answer p br {
		display:none;
	}
	.buyer .questions .inner ul li .answer p .marker{
		/* IE 8+ */
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffff00', GradientType=0)";
		/* IE 10 */
		background: -ms-linear-gradient(#ffffff 40%, #ffff00 60%);
		background: -webkit-linear-gradient(top,#ffffff 40%, #ffff00 60%);
		background: linear-gradient(to bottom #ffffff 40%, #ffff00 60%);
	}
	.buyer .questions .inner ul li .answer p span {
		display:initial;
	}
	.buyer .questions .inner ul li .answer p .cur1 {
		position:absolute;
		left:-11px;
		width:12px;
		display:none;
	}
	.buyer .questions .inner ul li .answer p .cur2 {
		position:absolute;
		left:18px;
		top:-9px;
		width:11px;
		display:block;
	}
}

@media only screen and (min-width: 671px) and (max-width: 970px){
	.buyer .questions {
		text-align: center;
		background-color: #df920b;
		padding: 60px 0;
		color:#ffffff;
	}
	.buyer .questions h2 {
		font-size: 2.14rem;
		margin-bottom: 40px;
		color: #ffffff;
	}
	.buyer .questions h2 span {
		display: inline;
	}
	.buyer .questions .inner {
		margin: 0 auto;
		width:98%;
		max-width:520px;
	}
	.buyer .questions .inner ul {
		margin:0 auto;
		width:450px;
	}
	.buyer .questions .inner ul li {
		margin-bottom: 20px;
	}
	.buyer .questions .inner ul li .question {
		width:470px;
		float:left;
	}
	.buyer .questions .inner ul li .question .num {
		border:#ffffff 2px solid;
		padding:3px 12px;
		float:left;
		font-size:1.4rem;
	}
	.buyer .questions .inner ul li .question p {
		float:left;
		padding:10px;
		font-size: 1.2rem;
		font-weight:bold;
		text-align:left;
	}
	.buyer .questions .inner ul li .answer {
		float:left;
		background-color:#ffffff;
		color:#4d4d4d;
		max-width:450px;
		text-align:left;
		width:100%;
		border-radius: 5px;
		margin-top:15px;
	}
	.buyer .questions .inner ul li .answer p {
		float:left;
		padding:15px 30px;
		font-size:1.08rem;
		position: relative;
	}
	.buyer .questions .inner ul li .answer p br {
		display:none;
	}
	.buyer .questions .inner ul li .answer p .marker{
		/* IE 8+ */
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffff00', GradientType=0)";
		/* IE 10 */
		background: -ms-linear-gradient(#ffffff 40%, #ffff00 60%);
		background: -webkit-linear-gradient(top,#ffffff 40%, #ffff00 60%);
		background: linear-gradient(to bottom #ffffff 40%, #ffff00 60%);
	}
	.buyer .questions .inner ul li .answer p span {
		display:initial;
	}
	.buyer .questions .inner ul li .answer p .cur1 {
		position:absolute;
		left:-11px;
		width:12px;
		display:none;
	}
	.buyer .questions .inner ul li .answer p .cur2 {
		position:absolute;
		left:26px;
		top:-9px;
		width:11px;
		display:block;
	}
}

@media only screen and (min-width: 971px){
	.buyer .questions {
		text-align: center;
		background-color: #df920b;
		padding: 70px 0;
		color:#ffffff;
	}
	.buyer .questions h2 {
		font-size: 2.14rem;
		margin-bottom: 40px;
		color: #ffffff;
	}
	.buyer .questions h2 span {
		display: inline;
	}
	.buyer .questions .inner {
		margin: 0 auto;
		width:98%;
		max-width:950px;
	}
	.buyer .questions .inner ul {
		margin:0 auto;
		width:auto;
	}
	.buyer .questions .inner ul li {
		margin-bottom: 20px;
	}
	.buyer .questions .inner ul li .question {
		width:470px;
		float:left;
	}
	.buyer .questions .inner ul li .question .num {
		border:#ffffff 2px solid;
		padding:3px 12px;
		float:left;
		font-size:1.4rem;
	}
	.buyer .questions .inner ul li .question p {
		float:left;
		padding:8px;
		font-size: 1.2rem;
		font-weight:bold;
		text-align:left;
	}
	.buyer .questions .inner ul li .answer {
		float:left;
		background-color:#ffffff;
		color:#4d4d4d;
		max-width:450px;
		text-align:left;
		width:100%;
		border-radius: 5px;
		margin-top:0px;
	}
	.buyer .questions .inner ul li .answer p {
		float:left;
		padding:15px 30px;
		font-size:1.06rem;
		position: relative;
	}
	.buyer .questions .inner ul li .answer p br {
		display:block;
	}
	.buyer .questions .inner ul li .answer p .marker{
		/* IE 8+ */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffff00', GradientType=0)";
	/* IE 10 */
		background: -ms-linear-gradient(#ffffff 40%, #ffff00 60%);
		background: -webkit-linear-gradient(top,#ffffff 40%, #ffff00 60%);
		background: linear-gradient(to bottom #ffffff 40%, #ffff00 60%);
	}
	.buyer .questions .inner ul li .answer p span {
		display:inline-flex;
	}
	.buyer .questions .inner ul li .answer p .cur1 {
		position:absolute;
		left:-11px;
		width:12px;
		display:block;
	}
	.buyer .questions .inner ul li .answer p .cur2 {
		position:absolute;
		left:-11px;
		width:11px;
		display:none;
	}
}



/* -------------------
	example
-------------------- */
.buyer .example {
	text-align: center;
	background: url(/img/prelogin/bg_example.png) #e9e7e1 repeat-x; background-position: bottom;
	padding: 60px 0 120px;
}
.buyer .example .inner {
	max-width: none;
	overflow: hidden;
	width: 100%;
}
.buyer .example .inner h2 {
	font-size: 1.42rem;
	margin-bottom: 30px;
	line-height: 1.2;
}
.buyer .example .inner h2 .lb {
	display: block;
}
.buyer .example .inner .bx-wrapper {
	max-width: 100% !important;
}
.buyer .example .inner .slide-all {
	height: 470px;
	position: relative;
}
.buyer .example .inner .slide-wrap {
  left: 50%;
  margin-left: -395px;
  position: absolute;
  width: 850px;
}
.buyer .example .inner .slide {
	margin-right: 14px !important;
	width: 254px !important;
}
.buyer .example .inner .slide a {
	background-color: #ffffff;
	border-radius: 5px;
	color: #333333;
	display: block;
	height: 425px;
	padding: 15px;
	position: relative;
}
.buyer .example .inner .slide a:hover {
	text-decoration: none;
}
.buyer .example .inner .slide a:hover .category {
	text-decoration: underline;
}
.buyer .example .inner .slide .shop-name {
	margin: 13px 0 23px;
	text-align: center;
	color: #df920b;
	font-size: 1.07rem;
	line-height: 1;
}
.buyer .example .inner .slide .shop-name span {
	display: block;
	margin-top: 5px;
}
.buyer .example .inner .slide .category {
	color: #df920b;
	font-size: 1.07rem;
	font-weight: bold;
	margin-bottom: 20px;
	text-align: center;
}
.buyer .example .inner .slide .category span {
  display: block;
}
.buyer .example .inner .slide .category a:hover {
	text-decoration: none;
}
.buyer .example .inner .slide .explain {
	font-size: 1.07rem;
	text-align: left;
}
.buyer .example .inner .slide .show-detail {
	bottom: 25px;
	color: #3893ee;
  position: absolute;
  right: 15px;
	text-align: right;
}
.buyer .example .inner .slide .show-detail img {
	margin-right: 5px;
}

/* tablet */
@media only screen and (min-width: 670px){
	.buyer .example {
		text-align: center;
		background-color: #e9e7e1;
		padding: 70px 0 130px;
	}
	.buyer .example .inner h2 {
		font-size: 30px;
		font-size: 2.14rem;
		margin-bottom: 50px;
	}
	.buyer .example .inner h2 .lb {
		display: block;
	}
	.buyer .example .inner .slide {
		margin-right: 30px !important;
		width: 270px !important;
	}
	.buyer .example .inner .slide a {
		padding: 15px;
	}
	.buyer .example .inner .slide-all {
		height: 460px;
		position: relative;
	}
	.buyer .example .inner .slide-wrap {
    left: 50%;
    margin-left: -584px;
    position: absolute;
    width: 1092px;
	}
	.buyer .example .inner .slide .shop-name {
		margin: 13px 0 23px;
		font-size: 0.92rem;
	}
	.buyer .example .inner .slide .category {
		margin-bottom: 15px;
	}
	.buyer .example .inner .slide .category span {
		display: block;
	}
	.buyer .example .inner .slide .explain {
		font-size: 1rem;
		text-align: left;
	}
}

/* PC */
@media only screen and (min-width: 1600px){
  .buyer .example .inner .slide-controller {
    max-width: 100%;
  } 
}

@media only screen and (min-width: 970px){
	.buyer .example .inner h2 .lb {
		display: inline;
	}
	.buyer .example .inner .slide-all {
		height: 480px;
		position: relative;
	}
	.buyer .example .inner .slide-wrap {
		left: 50%;
		margin-left: -788px;
		position: absolute;
		width: 1576px;
	}
	.buyer .example .inner .bx-wrapper .bx-viewport {
		width: 100% !important;
		margin-left: 0 !important;
	}
	.buyer .example .inner .slide {
		margin-right: 40px !important;
		width: 360px !important;
		float: none !important;
		display: inline-block !important;
	}
	.buyer .example .inner .slide a {
		padding: 25px;
	}
	.buyer .example .inner .slide .shop-name {
		font-size: 15px;
		font-size: 1.07rem;
	}
	.buyer .example .inner .slide .shop-name span {
		display: inline;
    font-size: 13px;
    font-size: 0.92rem;
	}
	.buyer .example .inner .slide .category {
		font-size: 17px;
		font-size: 1.21rem;
		height: 2.8em;
	}
	.buyer .example .inner .slide .explain {
		font-size: 15px;
		font-size: 1.07rem;
    height: 6em;
	}
}


/* -------------------
	charge
-------------------- */
.buyer .charge {
	text-align: center;
	background-color: #ffffff;
	padding: 60px 0;
}

.buyer .charge .inner {
	margin: 0 auto;
	position: relative;
	width: 100%;
}

.buyer .charge .inner h2 {
	font-size: 1.42rem;
}

.buyer .charge .inner h2 span {
	font-size: 2rem;
}

.buyer .charge .sub-title {
  margin: 30px 0 95px;
  line-height: 1.3;
  font-size: 1.14rem;
}

.buyer .charge .sub-title span {
	display: block;
}

.buyer .charge .inner ul {
	list-style: none;
}

.buyer .charge .inner > ul {
	margin: 0 auto 30px;
}

.buyer .charge .inner > ul > li {
	position: relative;
}

.buyer .charge .inner .plan {
	width: 94%;
	max-width: 330px;
	margin: 0 auto;
}

.buyer .charge .inner .free {
	border: solid 2px #cccccc;
	margin-bottom: 80px;
}

.buyer .charge .inner .business {
	border: solid 2px #e7ad48;
}

.buyer .charge .inner .free .plan-box {
	padding: 55px 0 20px;
	position: relative;
	background-color: #eeeeee;
}

.buyer .charge .inner .business .plan-box {
	padding: 55px 0 20px;
	position: relative;
	background-color: #f9e6c3;
}

.buyer .charge .inner .icon-outer-free {
	width: 109px;
	height: 109px;
	position: absolute;
	left: 50%;
	margin-left: -57px;
	top: -55px;
	border-radius: 50%;
	background-color: #cccccc;
}

.buyer .charge .inner .icon-outer-business {
	width: 109px;
	height: 109px;
	position: absolute;
	left: 50%;
	margin-left: -57px;
	top: -55px;
	border-radius: 50%;
	background-color: #e7ad48;
}

.buyer .charge .inner .icon-box {
	position: absolute;
	left: 50%;
	margin-left: -55px;
	top: -55px;
	border-radius: 50%;
	padding: 10px;
}

.buyer .charge .inner div .icon-box img	 {
	width: 85px;
	height: 85px;
}

.buyer .charge .inner .free > div .icon-box	 {
	background-color: #eeeeee;
}

.buyer .charge .inner .business > div .icon-box	 {
	background-color: #f9e6c3;
}

.buyer .charge .inner .flag-box {
	position: absolute;
	top: 20px;
	left: 50%;
	margin-left: -40px;
}

.buyer .charge .inner .flag-box img {
	width: 80px;
}

.buyer .charge .inner .plan-box .plan-name {
	font-size: 1.21rem;
	font-weight: bold;
	line-height: 1;
}

.buyer .charge .inner .business .plan-name {
	color: #df920b;
}

.buyer .charge .inner .plan-box .plan-text {
	font-size: 1.07rem;
	line-height: 1;
	margin: 10px 0 15px;
}

.buyer .charge .inner .plan-box .plan-charge {
	line-height: 1;
	margin: 0 auto;
}

.buyer .charge .inner .plan-box .plan-charge > span {
	border-bottom: solid 1px #4d4d4d;
	padding: 0 5px;
	font-size: 15px;
}

.buyer .charge .inner .free .plan-charge > span {
	padding: 0 15px;
}

.buyer .charge .inner .plan-box .plan-charge .yen {
	font-size: 1.5rem;
}

.buyer .charge .inner .plan-box .plan-charge .amount {
	font-size: 2.14rem;
}

.buyer .charge .inner .sub-box {
	padding: 15px;
	background-color: #ffffff;
}

.buyer .charge .inner .free .sub-box .sub-catch {
	font-size: 1.07rem;
	font-weight: bold;
	color: #a5a5a5;
	line-height: 1;
	text-align: center;
}

.buyer .charge .inner .business .sub-box .sub-catch {
	font-size: 1.07rem;
	font-weight: bold;
	color: #e7b55d;
	line-height: 1;
	text-align: center;
}

.buyer .charge .inner .plan ul {
	margin-top: 15px;
	font-size: 0.92rem;
}

.buyer .charge .inner .free ul li {
	list-style: none;
	margin-top: 10px;
	background: url(/img/prelogin/icon_check_free.png) no-repeat;
	background-size: 17px;
	background-position: 2px 2px;
	background: url(/img/prelogin/icon_check_free_s.png) no-repeat\9 /* ie8 */;
	padding: 0 0 4px 25px;
	line-height: 22px;
	border-bottom: solid 1px #dadada;
}

.buyer .charge .inner .business ul li {
	list-style: none;
	margin-top: 10px;
	background: url(/img/prelogin/icon_check_business_buy.png) no-repeat;
	background-size: 17px;
	background-position: 2px 2px;
	background: url(/img/prelogin/icon_check_business_buy_s.png) no-repeat\9 /* ie8 */;
	padding: 0 0 4px 25px;
	line-height: 22px;
	border-bottom: solid 1px #eedbb9;
}

.buyer .charge .inner .plan ul li:first-child {
	margin-top: 0;
}

.buyer .charge .inner .show-detail {
	padding-top: 10px;
	padding-right: 10px;
	border-top: dashed 1px #cccccc;
	text-align: right;
}

@media only screen and (min-width: 670px){

		.buyer .charge {
			padding: 70px 0;
		}

		.buyer .charge .inner h2 {
			font-size: 30px;
			font-size: 2.14rem;
		}

		.buyer .charge .inner h2 span {
			font-size: 3rem;
		}

		.buyer .charge .sub-title {
			font-size: 1.35rem;
		}

		.buyer .charge .sub-title span {
			display: inline;
		}

		.buyer .charge .inner > ul > li {
			width: 50%;
			float: left;
		}

}
@media only screen and (min-width: 970px){
		.buyer .charge h2 span {
			font-size: 4.07rem;
		}

		.buyer .charge .sub-title {
			margin: 30px 0 95px;
			font-size: 21px;
			font-size: 1.5rem;
			line-height: 1;
		}

		.buyer .charge .inner {
			max-width: 1070px;
		}

		.buyer .charge .inner > ul {
			width: 810px;
		}

		.buyer .charge .inner .plan {
			width: 350px;
			max-width: none;
		}

		.buyer .charge .inner .free .plan-box,
		.buyer .charge .inner .business .plan-box {
			padding: 70px 0 30px;
		}

		.buyer .charge .inner .free {
			margin: 0 auto 0 0;
		}

		.buyer .charge .inner .business {
			margin: 0 0 0 auto;
		}

		.buyer .charge .inner .icon-outer-free {
			left: 175px;
			margin-left: -53px;
			top: -53px;
		}

		.buyer .charge .inner .icon-outer-business {
			left: 226px;
			margin-left: -53px;
			top: -53px;
		}

		.buyer .charge .inner .icon-box {
			left: 175px;
			margin-left: -53px;
			top: -53px;
		}

		.buyer .charge .inner .plan-box .plan-text {
			font-size: 15px;
			font-size: 1.07rem;
			margin: 13px 0 20px;
		}

		.buyer .charge .inner .free .plan-charge > span {
			padding: 0 20px;
			margin: 0 auto;
		}

		.buyer .charge .inner .business .plan-charge {
			margin: 0 auto;
		}

		.buyer .charge .inner .plan-box .plan-charge .yen {
			font-size: 31px;
			font-size: 2.21rem;
		}

		.buyer .charge .inner .plan-box .plan-charge .amount {
			font-size: 41px;
			font-size: 2.92rem;
		}

		.buyer .charge .inner .sub-box {
			padding: 25px;
		}

		.buyer .charge .inner .free .sub-box .sub-catch {
			font-size: 17px;
			font-size: 1.21rem;
		}

		.buyer .charge .inner .business .sub-box .sub-catch {
			font-size: 17px;
			font-size: 1.21rem;
}

		.buyer .charge .inner .plan-box .plan-name {
			font-size: 23px;
			font-size: 1.64rem;
		}

		.buyer .charge .inner .plan ul {
		  margin-top: 15px;
		  font-size: 1.07rem;
		}

		.buyer .charge .inner .plan ul li:first-child {
		  margin-top: 0;
		}

		.buyer .charge .inner .show-detail {
			padding-right: 0;
		}
}


/* -------------------
	signup
 -------------------*/

.buyer .signup {
	background:#e9e7e1 url("/img/prelogin/bg_club_buy.png") 0 -20% repeat;
}

.buyer .signup h2{
	color:#df920b;
}

.buyer .signup .catch {
	font-size: 1.2rem;
	line-height: 1.3;
	margin-bottom: 30px;
}

.buyer .signup .catch span:first-child {
	font-weight: bold;
}

.buyer .signup .catch span:last-child {
	display: block;
}

.buyer .signup .signup-btn span input {
	background-image: -moz-linear-gradient(center top , #f0ad38, #d58b09);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #d58b09),color-stop(1, #f0ad38));
	background: -ms-linear-gradient(top, #f0ad38 0%, #d58b09 100%);
	background: linear-gradient(top, #f0ad38 0%, #d58b09 100%);
}
.buyer .signup .signup-btn span input:hover {
	background-image: -moz-linear-gradient(center top , #d58b09, #d58b09);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #d58b09),color-stop(1, #d58b09));
	background: -ms-linear-gradient(top, #d58b09 0%, #d58b09 100%);
	background: linear-gradient(top, #d58b09 0%, #d58b09 100%);
}

.buyer .bp-txt {
	margin-top: 20px;
	font-size: 15px;
}

.buyer .bp-txt span {
	display: block;
}

@media only screen and (min-width: 670px){
	.buyer .signup .catch {
		font-size: 21px;
		font-size: 1.5rem;
	}
	.buyer .bp-txt span {
		display: inline;
	}
}

@media only screen and (min-width: 970px){
	.buyer .signup .catch span:last-child {
		display: inline;
	}
}

/* キャンペーン文言用 */
.buyer .signup .campaign-1007 {
	font-size:0.9rem;
	padding:10px 15px;
	background-color:#fffae7;
	text-align:left;
	margin:0 5%;
	border-radius: 5px;
}
.buyer .signup .campaign-1007 .small {
	font-size:0.7rem;
}

@media only screen and (min-width: 670px){
	.buyer .signup .campaign-1007 {
		font-size:0.9rem;
		padding:10px 15px;
		background-color:#fffae7;
		width:510px;
		text-align:left;
		margin:0 auto;
		border-radius: 5px;
	}
	.buyer .signup .campaign-1007 .small {
		font-size:0.8rem;
	}
}
/* キャンペーン文言用 */


/* -------------------------------------------------------------------
 supplier
---------------------------------------------------------------------*/


/* -------------------
	main-visual
 -------------------*/
.supplier .main-visual {
	background: url("/img/prelogin/bg_main-v_sup.jpg") center center no-repeat;
	background-attachment: scroll\9; /* for ie8*/
	background-size:cover;
	overflow: hidden;
	height: 336px;
	position: relative;
}

.supplier .visual-cover {
	width: 100%;
	height: 336px;
	position: relative;
	margin: 0 auto;
}

.supplier .visual-cover .mv-buy {
	position: absolute;
	top: 210px;
	left: 50%;
}

.supplier .visual-cover img {
	width: 60%;
	margin-left: -30%;
}

.supplier .visual-cover + div {
	width: 100%;
	height: 20px;
	position: absolute;
	bottom: 0;
	overflow: hidden;
}

.supplier .visual-cover + div .arrow-l {
	width: 50%;
	height: 20px;
	float: left;
	margin-left: -34px;
	background-color: #85c9ed;
}

.supplier .visual-cover + div .arrow {
	width: 68px;
	height: 20px;
	float: left;
	background-image: url(/img/prelogin/img_mv-cover_sup.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}

.supplier .visual-cover + div .arrow-r {
	width: 50%;
	height: 20px;
	float: right;
	margin-right: -34px;
	background-color: #85c9ed;
}

.supplier .text-wrap {
	position: relative;
	z-index: 10;
}

.supplier .login-btn .login-box,
.supplier .login-btn .login-btn-inner {
	display:none;
}

.supplier h1 {
	font-size: 1.71rem;
	padding:1.5em 0.5em 0;
	margin:0 auto;
	line-height: 1.2;
	text-align: center;
}

.supplier h1 .str {
	font-size: 1.85rem;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 10px;
	display: block;
}

.supplier h1 + p  {
	padding: 0;
}

.supplier h1 + p .a {
	font-size: 1.28rem;
	margin-top: 5px;
	display: block;
	line-height: 1;
	text-shadow: 0 0px 4px #fff;
	text-align: center;
}

.supplier .text-wrap .signup-btn {
	padding:1em 0 0;
	width:13em;
	margin: 20px auto 0;
	padding: 3px;
	background-color: #ffffff;
	border-radius: 5px;
}

.supplier .container {
	background-color:#fff;
}

.supplier h2 {
	font-size: 2.14rem;
	color: #4d4d4d;
	text-align: center;
	font-weight: normal;
	line-height: 1;
}

@media only screen and (min-width: 375px){
		.supplier .main-visual {
			overflow: hidden;
			height: 370px;
		}

		.supplier .visual-cover {
			max-width: 1366px;
			height: 370px;
		}

		.supplier .visual-cover .mv-buy {
			bottom: -2%;
			top: auto;
			left: 50%;
		}

		.supplier .visual-cover img {
			bottom: -2%;
			top: auto;
			left: 50%;
			margin-left: -125px;
			width: 250px;
		}
}

@media only screen and (min-width: 670px){
		.supplier .main-visual {
			overflow: hidden;
			height: 346px;
		}

		.supplier .visual-cover {
			max-width: 1366px;
			height: 346px;
		}

		.supplier .visual-cover img {
			max-width: 510px;
			width: 52%;
		}

		.supplier .visual-cover + div {
			height: 30px;
		}

		.supplier .visual-cover + div .arrow-l {
			height: 30px;
			margin-left: -50px;
		}
		
		.supplier .visual-cover + div .arrow {
			width: 100px;
			height: 30px;
		}

		.supplier .visual-cover + div .arrow-r {
			height: 30px;
			margin-right: -50px;
		}

		.supplier .visual-cover .mv-buy {
			position: absolute;
			top: auto;
			bottom: -40px;
			right: 5%;
			left: auto;
		}

		.supplier .text-wrap {
			position: absolute;
			left: 5%;
			top: 65px;
			z-index: 0;
		}

		.supplier h1 {
			text-align: left;
		}

		.supplier h1 .str {
			margin-bottom: 20px;
			font-size: 2.5rem;
			line-height: 1;
			text-align: left;
		}

		.supplier h1 + p  {
			padding: 0 0.9em;
		}

		.supplier h1 +p .a {
			font-size: 1.5rem;
			line-height: 1.3;
			text-align: left;
		}

		.supplier .text-wrap .signup-btn {
			margin: 20px 0.9em 0;
		}

		.supplier .login-btn .login-box,
		.supplier .login-btn .login-btn-inner {
			display:block;
		}
}

@media only screen and (min-width: 970px){
		.supplier .main-visual {
			height: 517px;
		}

		.supplier .visual-cover {
			position: relative;
			height: 517px;
		}

		.supplier .visual-cover img {
			max-width: 655px;
			width: 57%;
		}

		.supplier .visual-cover + div {
			height: 40px;
		}

		.supplier .visual-cover + div .arrow-l {
			width: 50%;
			height: 40px;
			margin-left: -67px;
		}

		.supplier .visual-cover + div .arrow {
			width: 134px;
			height: 40px;
			float: left
		}

		.supplier .visual-cover + div .arrow-r {
			width: 50%;
			height: 40px;
			margin-right: -67px;
		}

		.supplier .visual-cover .mv-buy {
			position: absolute;
			bottom: 0;
		}

		.supplier .text-wrap {
			position: absolute;
			left: 4%;
			top: 125px;
		}

		.supplier h1 {
			line-height: 1.6;
			text-align: left;
			padding: 0;
			font-size: 2.36rem;
		}

		.supplier h1 .str {
			margin-bottom: 20px;
			font-size: 35px;
			font-size: 2.5rem;
			line-height: 1;
		}

		.supplier h1 .str span {
			font-size: 52px;
			font-size: 3.7rem;
			font-weight: bold;
		}

		.supplier h1 + p  {
			padding: 0;
		}

		.supplier h1 + p .a {
			font-size: 26px;
			font-size: 1.85rem;
			line-height: 1.3;
		}

		.supplier .text-wrap .signup-btn {
			font-size: 20px;
			line-height: 52px;
			margin: 35px 0 0 5px;
			vertical-align: bottom;
		}

		.supplier .text-wrap .signup-btn a {
			height:50px;
		}
}

@media only screen and (min-width: 1280px){
		.supplier .visual-cover img {
			max-width: 655px;
			width: 100%;
		}

		.supplier .visual-cover .mv-buy {
			right: 6.8%;
		}

		.supplier .text-wrap {
			top: 105px;
		}

		.supplier h1 .str {
			margin-bottom: 20px;
			font-size: 2.93rem;
			line-height: 1;
		}

		.supplier h1 .str span {
			font-size: 3.7rem;
			font-weight: bold;
		}

		.supplier h1 + p .a {
		  font-size: 2.12rem;
		  line-height: 1.4;
		}

}


/* -------------------
	intro
-------------------- */
/* PC */
@media only screen and (min-width: 970px){
		.supplier .lb-1st {
			display: inline;
		}

		.supplier .lb-2nd {
			display: inline;
		}

		.supplier .intro {
			text-align: center;
			background-color: #85c9ed;
		}

		.supplier .intro .inner {
			max-width: 1366px;
			margin: 0 auto 0;
			padding: 1em 0 45px;
			position: relative;
			width: 90%;
		}

		.supplier .intro .inner h2 {
			color: #ffffff;
			font-size: 30px;
			font-size: 2.14rem;
			line-height: 1.2;
			margin: 0.88em 0 44px;
		}

		.supplier .intro .inner ul {
			list-style: none;
			margin: 0 auto;
			max-width: 950px;
		}

		.supplier .intro .inner > ul > li {
			width: 33.3%;
			float: left;
			margin-top: 0;
		}

		.supplier .intro .inner > ul > li:first-child {
			margin-left: 0;
		}

		.supplier .intro .inner > ul > li > div {
			border-radius: 50%;
		}

		.supplier .intro .inner > ul > li > div:first-child {
			width: 210px;
			height: 210px;
			background-color: #ffffff;
			border-radius: 50%;
		}

		.supplier .intro .inner li div div {
			height: 170px;
		}

		.supplier .intro .inner .easy {
			margin: 0 auto 0 28px;
		}

		.supplier .intro .inner .free {
			margin: 0 auto;
		}

		.supplier .intro .inner .support {
			margin: 0 28px 0 auto;
		}

		.supplier .intro .inner .easy img {
			margin: 53px 0 0 10px;
			width: 160px;
		}

		.supplier .intro .inner .free img {
			margin: 22px 0 0 0;
			width: 128px;
		}

		.supplier .intro .inner .support img {
			margin: 50px 0 0 13px;
			width: 150px;
		}

    .supplier .intro .inner .text-box {
      color: #ffffff;
      width: 210px;
    }

		.supplier .intro .inner .easy + .text-box {
			margin: 13px auto 0 28px;
		}

    .supplier .intro .inner .free + .text-box {
      margin: 13px auto 0;
    }

    .supplier .intro .inner .support + .text-box {
      margin: 13px 28px 0 auto;
    }

		.supplier .intro .inner .title {
			color: #ffffff;
			font-size: 22px;
			font-weight: bold;
		}

		.supplier .intro .inner .text {
			color: #ffffff;
			font-size: 16px;
			margin-top: 8px;
			text-align: left;
			width: 210px;
		}

    .supplier .intro .inner .text span {
      letter-spacing: -1em;
    }
}

/* TABLET */
@media screen and (max-width: 969px) and (min-width: 671px) {
		.supplier .lb-1st {
			display: inline;
		}

		.supplier .lb-2nd {
			display: block;
		}

		.supplier .intro {
			text-align: center;
			background-color: #85c9ed;
		}

		.supplier .intro .inner h2 {
			color: #ffffff;
			font-size: 30px;
			font-size: 2.14rem;
			line-height: 1.2;
			margin: 0.88em 0 1.7em;
		}

		.supplier .intro .inner {
			max-width: 1366px;
			margin: 0 auto 0;
			padding: 1em 0 5em;
			position: relative;
			width: 90%;
		}

		.supplier .intro .inner ul {
			max-width: 950px;
		}

		.supplier .intro .inner ul li {
			width: 33.3%;
			float: left;
			margin-top: 0;
		}

		.supplier .intro .inner > ul > li:first-child {
			margin-top: 0;
		}

		.supplier .intro .inner > ul > li > div {
			border-radius: 50%;
		}

		.supplier .intro .inner > ul > li > div:first-child {
			background-color: #ffffff;
			height: 195px;
			width: 195px;
		}

		.supplier .intro .inner .easy {
			margin: 0 auto;
		}

		.supplier .intro .inner .free {
			margin: 0 auto;
		}

		.supplier .intro .inner .support {
			margin: 0 auto;
		}

		.supplier .intro .inner .easy img {
			margin: 50px 0 0 12px;
			width: 150px;
		}

		.supplier .intro .inner .free img {
			margin: 18px 0 0 0;
			width: 122px;
		}

		.supplier .intro .inner .support img {
			margin: 45px 0 0 8px;
			width: 140px;
		}

		.supplier .intro .inner .text-box {
			color: #ffffff;
			margin: 15px auto 0;
			width: 195px;
		}

		.supplier .intro .inner .title {
			color: #ffffff;
			font-size: 18px;
			font-size: 1.28rem;
			font-weight: bold;
			margin-top: 15px;
		}

		.supplier .intro .inner .text {
			color: #ffffff;
			font-size: 15px;
			font-size: 1.07rem;
			margin: 15px auto 0;
			text-align: left;
			width: 195px;
		}

    .supplier .intro .inner .text span {
      letter-spacing: -1em;
    }
}

/* SP */
@media screen and (max-width: 670px) {
		.supplier .lb-1st {
			display: block;
		}

		.supplier .lb-2nd {
			display: block;
		}

		.supplier .intro {
			text-align: center;
			background-color: #85c9ed;
		}

		.supplier .intro .inner {
			margin: 0 auto 0;
			padding: 1em 0 5em;
			position: relative;
		}

		.supplier .intro .inner h2 {
			color: #ffffff;
			font-size: 1.42rem;
			line-height: 1.2;
			margin: 0.88em 0 1.7em;
		}

		.supplier .intro .inner ul {
			list-style: none;
			margin: 0 auto;
		}

		.supplier .intro .inner > ul > li {
			margin-top: 40px;
		}

		.supplier .intro .inner > ul > li:first-child {
			margin-top: 0;
		}

		.supplier .intro .inner > ul > li > div {
			border-radius: 50%;
		}

		.supplier .intro .inner > ul > li > div:first-child {
			width: 210px;
			height: 210px;
			background-color: #ffffff;
			border-radius: 50%;
		}

		.supplier .intro .inner .easy {
			margin: 0 auto;
			
		}

		.supplier .intro .inner .free {
			margin: 0 auto;
		}

		.supplier .intro .inner .support {
			margin: 0 auto;
		}

    .supplier .intro .inner .easy img {
      margin: 53px 0 0 12px;
      width: 160px;
    }

    .supplier .intro .inner .free img {
      margin: 18px 0 0 0;
      width: 130px;
    }

    .supplier .intro .inner .support img {
      margin: 42px 0 0 13px;
      width: 160px;
    }

		.supplier .intro .inner .text-box {
			color: #ffffff;
			margin: 15px auto 0;
			width: 220px;
		}

		.supplier .intro .inner .title {
			font-size: 1.14rem;
			font-weight: bold;
		}

		.supplier .intro .inner .text {
			margin-top: 15px;
		}
}

/* -------------------
	form-type
-------------------- */

/* PC */
@media only screen and (min-width: 970px) {
		.supplier .form-type {
			padding: 70px 0;
			margin: 0 auto;
			width: 98%;
		}

		.supplier .form-type h2 {
			font-size: 30px;
			font-size: 2.14rem;
			margin-bottom: 60px;
		}

		.supplier .form-type .fadeimg-wrap {
			margin: 0 auto;
			max-width: 1170px;
			width: 98%;
		}

		.supplier .form-type #fadeNaviSup {
			float: left;
			margin: 1% 0 0 20px;
			max-width: 355px;
			width: 32%;
		}

/* naviのmargin調整 */
@media only screen and (min-width: 1100px) {
		.supplier .form-type #fadeNaviSup {
			margin: 3% 0 0 20px;
		}
}
@media only screen and (min-width: 1280px) {
		.supplier .form-type #fadeNaviSup {
			margin: 50px 0 0 20px;
		}
}

		.supplier .form-type #fadeNaviSup li {
			background-color: #ffffff;
			border: solid 2px #85c9ed;
			border-radius: 5px;
			box-sizing: border-box;
			float: none;
			margin: 0 0 25px 0;
			position: relative;
			text-align: left;
			width: auto;
		}


		.supplier .form-type #fadeNaviSup li:before {
			border: solid 20px transparent;
			border-left: solid 20px #85c9ed;
			bottom: auto;
			content: "";
			display: block;
			position: absolute;
			left: auto;
			margin-left: auto;
			margin-top: -20px;
			right: -42px;
			top: 50%;
		}

		.supplier .form-type #fadeNaviSup li:after {
			border: solid 20px transparent;
			border-left: solid 20px #ffffff;
			bottom: auto;
			content: "";
			display: block;
			position: absolute;
			left: auto;
			margin-left: auto;
			margin-top: -20px;
			right: -40px;
			top: 50%;
		}

		.supplier .form-type #fadeNaviSup .fadeimg_here:before {
			border: solid 20px transparent;
			border-left: solid 20px #85c9ed;
			bottom: auto;
			content: "";
			display: block;
			position: absolute;
			left: auto;
			margin-left: auto;
			margin-top: -20px;
			right: -42px;
			top: 50%;
		}

		.supplier .form-type #fadeNaviSup li:hover:after,
		.supplier .form-type #fadeNaviSup .fadeimg_here:after {
			border: solid 20px transparent;
			border-left: solid 20px #85c9ed;
			bottom: auto;
			content: "";
			display: block;
			position: absolute;
			left: auto;
			margin-left: auto;
			margin-top: -20px;
			right: -40px;
			top: 50%;
		}

		.supplier .form-type #fadeNaviSup li:last-child {
			margin-bottom: 0;
		}

		.supplier .form-type #fadeNaviSup li:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here {
			background-color: #85c9ed;
			color: #ffffff;
		}

		.supplier .form-type #fadeNaviSup li a {
			color: #4d4d4d;
			display: block;
			padding: 18px;
		}

		.supplier .form-type #fadeNaviSup li a:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here a {
			color: #ffffff;
			text-decoration: none;
		}

		.supplier .form-type #fadeNaviSup li a:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here a:hover {
			color: #ffffff;
			text-decoration: none;
		}

		.supplier .form-type #fadeNaviSup li .num {
			background-color: #85c9ed;
			border-radius: 50%;
			color: #ffffff;
			font-size: 24px;
			font-size: 1.71rem;
			font-weight: bold;
			height: 1.4em;
			line-height: 1.5;
			margin-top: -0.5em;
			position: absolute;
			text-align: center;
			top: 45%;
			width: 1.4em;
		}

		.supplier .form-type #fadeNaviSup li:hover .num,
		.supplier .form-type #fadeNaviSup .fadeimg_here .num {
			background-color: #ffffff;
			color: #85c9ed;
		}

		.supplier .form-type #fadeNaviSup li .title {
			color: #85c9ed;
			font-size: 18px;
			font-size: 1.28rem;
			font-weight: bold;
			margin: 0 0 5px 45px;
			position: static;
			text-align: left;
		}

		.supplier .form-type #fadeNaviSup li .title .pc-txt {
			display: block;
		}

		.supplier .form-type #fadeNaviSup li .title .sp-txt {
			display: none;
		}

		.supplier .form-type #fadeNaviSup li:hover .title,
		.supplier .form-type #fadeNaviSup .fadeimg_here .title {
			color: #ffffff;
		}

		.supplier .form-type #fadeNaviSup li img {
			left: 195px;
			position: absolute;
			top: 16px;
			width: 68px;
		}

		.supplier .form-type #fadeNaviSup li .text {
			display: block;
			line-height: 1.3;
			margin-left: 45px;
			position: static;
		}

		.supplier .form-type #fadeImgSup {
			float: left;
			margin-left: 5%;
			min-width: 540px;
			position: relative;
			width: 60%;
		}

		.supplier .form-type #fadeImgSup .show-sample a {
			display: none;
		}

		.supplier .form-type #fadeImgSup .fadeimg1_on .show-sample a {
			display: inline-block !important;
		}

		.supplier .form-type #fadeImgSup li {
			left: 0;
			margin: 0;
			text-align: center;
			top: 0;
			width: 100%;
			z-index: 0 !important;
		}

		.supplier .form-type #fadeImgSup li img {
			margin: 0 auto;
			max-width: 696px;
			width: 100%;
		}

		.supplier .form-type #fadeImgSup li .text {
			display: none;
			margin-bottom: 0;
		}

		.supplier .form-type #fadeImgSup li .show-sample {
			display: block;
		}
}

/* TABLET */
@media screen and (max-width: 969px) and (min-width: 671px) {
		.supplier .form-type {
			margin: 0 auto;
			padding: 70px 0;
			width: 98%;
		}

		.supplier .form-type .inner {
			margin: 0 auto;
			width: 98%;
		}

		.supplier .form-type h2 {
			font-size: 30px;
			font-size: 2.14rem;
			margin-bottom: 50px;
		}

		.supplier .form-type #fadeNaviSup {
			margin: 0 auto;
			max-width: none;
			width: 98%;
		}

		.supplier .form-type #fadeNaviSup li {
			background-color: #ffffff;
			border: solid 2px #85c9ed;
			border-radius: 5px;
			box-sizing: border-box;
			float: left;
			margin-left: 2%;
			position: relative;
			text-align: left;
			width: 32%;
		}

		.supplier .form-type #fadeNaviSup li:before {
			border: solid 12px transparent;
			border-top: solid 16px #85c9ed;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			top: 50px;
		}

		.supplier .form-type #fadeNaviSup li:after {
			border: solid 12px transparent;
			border-top: solid 16px #ffffff;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			top: 47px;
		}

		.supplier .form-type #fadeNaviSup .fadeimg_here:before {
			border: solid 12px transparent;
			border-top: solid 16px #85c9ed;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			top: 50px;
		}

		.supplier .form-type #fadeNaviSup li:hover:after,
		.supplier .form-type #fadeNaviSup .fadeimg_here:after {
			border: solid 12px transparent;
			border-top: solid 16px #85c9ed;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			top: 47px;
		}

		.supplier .form-type #fadeNaviSup li:first-child {
			margin-left: 0;
		}

		.supplier .form-type #fadeNaviSup li:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here {
			background-color: #85c9ed;
		}

		.supplier .form-type #fadeNaviSup li a {
			color: #4d4d4d;
			display: block;
			padding: 15px 10px;
			position: relative;
		}

		.supplier .form-type #fadeNaviSup li a:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here a {
			color: #ffffff;
			text-decoration: none;
		}

		.supplier .form-type #fadeNaviSup li .num {
			background-color: #85c9ed;
			border-radius: 50%;
			color: #ffffff;
			font-size: 16px;
			font-size: 1.14rem;
			font-weight: bold;
			height: 1.5em;
			line-height: 1.6;
			margin-top: -0.5em;
			position: absolute;
			text-align: center;
			top: 43%;
			width: 1.5em;
		}

		.supplier .form-type #fadeNaviSup li:hover .num,
		.supplier .form-type #fadeNaviSup .fadeimg_here .num {
			background-color: #ffffff;
			color: #85c9ed;
		}

		.supplier .form-type #fadeNaviSup li .title .pc-txt {
			display: none;
		}

		.supplier .form-type #fadeNaviSup li .title .sp-txt {
			display: block;
		}

		.supplier .form-type #fadeNaviSup li .title {
			color: #85c9ed;
			font-size: 16px;
			font-size: 1.14rem;
			font-weight: bold;
			line-height: 1.2;
			margin-left: 0;
			text-align: center;
		}

		.supplier .form-type #fadeNaviSup li a h3 {
			color: #85c9ed;
			font-size: 16px;
			font-size: 1.14rem;
			font-weight: bold;
			line-height: 1.2;
			margin-left: 0;
			text-align: center;
			padding-left: 22px;
		}

		.supplier .form-type #fadeNaviSup li:hover .title,
		.supplier .form-type #fadeNaviSup .fadeimg_here .title {
			color: #ffffff;
		}

		.supplier .form-type #fadeNaviSup li img {
			left: -5px;
			position: absolute;
			top: -10px;
			width: 68px;
		}

		.supplier .form-type #fadeNaviSup li .text {
			display: none;
		}

		.supplier .form-type #fadeNaviSup li .title .pc-txt {
			display: block;
		}

		.supplier .form-type #fadeNaviSup li .title .sp-txt {
			display: none;
		}

		.supplier .form-type #fadeImgSup {
			float: left;
			margin-top: 0;
			position: relative;
			text-align: right;
			width: 100%;
		}

		.supplier .form-type #fadeImgSup .show-sample {
			margin: 0 auto;
			max-width: 696px;
		}

		.supplier .form-type #fadeImgSup .show-sample a {
			display: none;
		}

		.supplier .form-type #fadeImgSup .fadeimg1_on .show-sample a {
			display: inline-block !important;
		}

		.supplier .form-type #fadeImgSup li .text {
			display: block;
			font-size: 1.07rem;
			font-size: 15px;
			margin: 35px 0 15px;
		}

		.supplier .form-type #fadeImgSup li {
			left: 0;
			margin: 0;
			text-align: center;
			top: 0;
			width: 100%;
			z-index: 0 !important;
		}

		.supplier .form-type #fadeImgSup li img {
			margin: 0 auto;
			max-width: 696px;
			width: 98%;
		}
}

/* SP */
@media screen and (max-width: 670px) {
		.supplier .form-type {
			margin: 0 auto;
			padding: 60px 0;
			width: 98%;
		}

		.supplier .form-type h2 {
			font-size: 1.42rem;
			margin-bottom: 30px;
		}

		.supplier .form-type .inner {
			margin: 0 auto;
			width: 98%;
		}

		.supplier .form-type #fadeNaviSup {
			margin: 0 auto;
			max-width: 700px;
			width: 94%;
		}

		.supplier .form-type #fadeNaviSup li {
			background-color: #ffffff;
			border: solid 2px #85c9ed;
			border-radius: 5px;
			box-sizing: border-box;
			float: left;
			margin-left: 2%;
			position: relative;
			text-align: left;
			width: 32%;
		}

		.supplier .form-type #fadeNaviSup li:before {
			border: solid 8px transparent;
			border-top: solid 12px #85c9ed;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			bottom: -22px;
		}

		.supplier .form-type #fadeNaviSup li:after {
			border: solid 8px transparent;
			border-top: solid 12px #ffffff;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			bottom: -19px;
		}

		.supplier .form-type #fadeNaviSup .fadeimg_here:before {
			border: solid 8px transparent;
			border-top: solid 12px #85c9ed;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			bottom: -22px;
		}

		.supplier .form-type #fadeNaviSup li:hover:after,
			 .supplier .form-type #fadeNaviSup .fadeimg_here:after {
			border: solid 8px transparent;
			border-top: solid 12px #85c9ed;
			content: "";
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -6px;
			bottom: -19px;
		}


		.supplier .form-type #fadeNaviSup li:first-child {
			margin-left: 0;
		}

		.supplier .form-type #fadeNaviSup li:nth-child(3) {
			height: 44px;
		}

		.supplier .form-type #fadeNaviSup li:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here {
			background-color: #85c9ed;
		}

		.supplier .form-type #fadeNaviSup li a {
			color: #4d4d4d;
			display: block;
			padding: 5px;
			position: relative;
		}

		.supplier .form-type #fadeNaviSup li a.last {
			top: 7px;
		}

		.supplier .form-type #fadeNaviSup li a:hover,
		.supplier .form-type #fadeNaviSup .fadeimg_here a:hover {
			color: #ffffff;
			text-decoration: none;
		}

		.supplier .form-type #fadeNaviSup li .num {
			background-color: #85c9ed;
			border-radius: 50%;
			color: #ffffff;
			font-size: 0.93rem;
			font-weight: bold;
			height: 1.25em;
			line-height: 1.25;
			margin-top: -0.5em;
			position: absolute;
			text-align: center;
			top: 43%;
			width: 1.25em;
		}

		.supplier .form-type #fadeNaviSup li:hover .num,
		.supplier .form-type #fadeNaviSup .fadeimg_here .num {
			background-color: #ffffff;
			color: #85c9ed;
		}

		.supplier .form-type #fadeNaviSup li .title .pc-txt {
			display: none;
		}

		.supplier .form-type #fadeNaviSup li .title .sp-txt {
			display: block;
		}

		.supplier .form-type #fadeNaviSup li .title {
			color: #85c9ed;
			font-size: 0.93rem;
			font-weight: bold;
			line-height: 1.2;
			margin-left: 1.75em;
			text-align: left;
		}

		.supplier .form-type #fadeNaviSup li:hover .title,
		.supplier .form-type #fadeNaviSup .fadeimg_here .title {
			color: #ffffff;
		}

		.supplier .form-type #fadeNaviSup li img {
			left: -5px;
			position: absolute;
			top: -5px;
			width: 40px;
		}

		.supplier .form-type #fadeNaviSup li .text {
			display: none;
		}

		.supplier .form-type #fadeImgSup {
			float: left;
			margin-top: 0;
			position: relative;
			text-align: right;
			width: 100%;
		}

		.supplier .form-type #fadeImgSup li {
			margin: 0;
			left: 0;
			top: 0;
			text-align: center;
			width: 100%;
			z-index: 0 !important;
		}

		.supplier .form-type #fadeImgSup li img {
			margin: 0 auto;
			width: 98%;
		}

		.supplier .form-type #fadeImgSup li .text {
			margin: 25px 0 15px;
		}

		.supplier .form-type #fadeImgSup li .show-sample {
			display: none;
		}
}

/* -------------------
	case
-------------------- */
/* PC */
@media only screen and (min-width: 970px){
		.supplier .case {
			background-color:#f5fcff;
			padding: 80px 0;
		}
		
		.supplier .case .inner {
			margin: 0 auto;
			max-width: 1170px;
			width: 98%;
		}
		
		.supplier .case .inner .case-box {
			margin: 0 auto;
			max-width: 970px;
			width: 100%;
		}

		.supplier .case .inner .case-box .text-box1 {
			float: left;
			font-size: 15px;
			font-size: 1.07rem;
			margin-top: 150px;
			max-width: 420px;
			width: 43%;
		}

		.supplier .case .inner .case-box .text-box1 .text {
			margin: 20px 70px 0 0;
		}

		.supplier .case .inner .case-box .text-box1 .title {
			font-size: 1.5rem;
			font-size: 21px;
			font-weight: bold;
			line-height: 1;
		}

		.supplier .case .inner .case-box .image-box1 {
			float: left;
			max-width: 550px;
			width: 57%;
		}

		.supplier .case .inner .separator1 {
			line-height: 1px;
			margin: 60px auto 45px;
			width: 90%;
			max-width: 1170px;
		}
		
		.supplier .case .inner .case-box .text-box2 {
			float: right;
			font-size: 15px;
			font-size: 1.07rem;
			margin-top: 120px;
			max-width: 396px;
			width: 40.5%;
		}

		.supplier .case .inner .case-box .text-box2 .title {
			font-size: 1.5rem;
			font-size: 21px;
			font-weight: bold;
			line-height: 1;
			margin-left: 35px;
		}

		.supplier .case .inner .case-box .text-box2 .text {
			margin: 20px 0 0 35px;
		}

		.supplier .case .inner .case-box .image-box2 {
			float: left;
			max-width: 574px;
			width: 59.5%;
		}

		.supplier .case .inner .separator2 {
			line-height: 1px;
			margin: 0 auto 40px;
		}
		
		.supplier .case .inner .case-box .text-box3 {
			float: left;
			font-size: 15px;
			font-size: 1.07rem;
			margin-top: 150px;
			max-width: 479px;
			width: 49%;
		}

		.supplier .case .inner .case-box .text-box3 .title {
			font-size: 1.5rem;
			font-size: 21px;
			font-weight: bold;
			line-height: 1;
		}

		.supplier .case .inner .case-box .text-box3 .text {
			margin: 20px 115px 0 0;
		}

		.supplier .case .inner .case-box .image-box3 {
			float: left;
			max-width: 491px;
			width: 51%;
		}
}

/* TABLET */
@media screen and (max-width: 969px) and (min-width: 671px) {
		.supplier .case {
			background-color:#f5fcff;
			padding: 60px 0;
		}

		.supplier .case .inner {
			margin: 0 auto;
			width: 98%;
		}

		.supplier .case .inner .case-box {
			margin: 0 auto;
			max-width: 760px;
			width: 94%;
		}

		.supplier .case .inner .case-box .text-box1,
		.supplier .case .inner .case-box .text-box3 {
			float: left;
			margin: 90px auto 0;
			max-width: 320px;
			width: 42%;
		}

		.supplier .case .inner .case-box .text-box1 .title,
		.supplier .case .inner .case-box .text-box3 .title {
			font-size: 18px;
			font-size: 1.28rem;
			font-weight: bold;
			line-height: 1;
			text-align: left;
		}

		.supplier .case .inner .case-box .text-box1 .text,
		.supplier .case .inner .case-box .text-box3 .text {
			margin-top: 20px;
			font-size: 14px;
			font-size: 1rem;
		}

		.supplier .case .inner .case-box .image-box1,
		.supplier .case .inner .case-box .image-box3 {
			float: left;
			margin-top: 20px;
			max-width: 440px;
			width: 58%;
		}

		.supplier .case .inner .case-box .text-box2 {
			float: right;
			margin: 50px auto 0;
			max-width: 320px;
			width: 42%;
		}

		.supplier .case .inner .case-box .text-box2 .title {
			font-size: 18px;
			font-size: 1.28rem;
			font-weight: bold;
			line-height: 1;
			text-align: left;
		}

		.supplier .case .inner .case-box .text-box2 .text {
			margin-top: 20px;
			font-size: 14px;
			font-size: 1rem;
		}

		.supplier .case .inner .case-box .image-box2 {
			float: left;
			margin-top: 20px;
			max-width: 440px;
			width: 58%;
		}

		.supplier .case .inner .case-box .image-box1 img,
		.supplier .case .inner .case-box .image-box2 img,
		.supplier .case .inner .case-box .image-box3 img {
			width: 90%;
		}

		.supplier .case .inner .separator1 {
			line-height: 1px;
			margin: 40px auto 25px;
			width: 98%;
		}

		.supplier .case .inner .separator2 {
			line-height: 1px;
			margin: 0 auto 25px;
		}
}

/* SP */
@media screen and (max-width: 670px) {
		.supplier .case {
			background-color:#f5fcff;
			padding: 60px 0;
		}

		.supplier .case .inner {
			margin: 0 auto;
			max-width: 1170px;
			width: 98%;
		}

		.supplier .case h2 {
			font-size: 1.42rem;
			margin-bottom: 30px;
		}

		.supplier .case .inner .case-box {
			margin: 0 auto 80px;
			width: 94%;
		}

		.supplier .case .inner .case-box:last-child {
			margin-bottom: 0;
		}

		.supplier .case .inner .case-box .text-box1,
		.supplier .case .inner .case-box .text-box2,
		.supplier .case .inner .case-box .text-box3 {
			float: none;
			margin: 30px auto 0;
			width: 94%;
		}

		.supplier .case .inner .separator1 {
			display: none;
		}

		.supplier .case .inner .separator2 {
			display: none;
		}

		.supplier .case .inner .case-box .image-box1,
		.supplier .case .inner .case-box .image-box2,
		.supplier .case .inner .case-box .image-box3 {
			float: none;
			margin: 10px auto 0;
			text-align: center !important;
			width: 98%;
		}

		.supplier .case .inner .case-box .image-box1 img,
		.supplier .case .inner .case-box .image-box2 img,
		.supplier .case .inner .case-box .image-box3 img {
			width: 100%;
		}

		.supplier .case .inner .case-box .title {
			font-size: 1.14rem;
			font-weight: bold;
			line-height: 1;
			text-align: center;
		}

		.supplier .case .inner .case-box .text {
			margin-top: 20px;
		}
}

/* -------------------
	system-explain
-------------------- */
/* PC */
@media only screen and (min-width: 970px){
		.supplier .system-explain {
			background-color: #bbe7fe;
			padding: 80px 0;
		}

		.supplier .system-explain .inner {
			margin: 0 auto;
			max-width: 1130px;
			width: 98%;
		}

		.supplier .system-explain .inner ul {
			margin: 60px auto 0;
			max-width: 1130px;
			width: 98%;
		}

		.supplier .system-explain .inner ul .left {
			float: left;
			width: 33.3%;
		}

		.supplier .system-explain .inner ul .center {
			float: left;
			width: 33.3%;
		}

		.supplier .system-explain .inner ul .right {
			float: left;
			width: 33.3%;
		}

		.supplier .system-explain .inner ul .img-box {
			background-color: #f1fbff;
			border-radius: 5px 5px 0 0;
			height: 207px;
			text-align: center;
			max-width: 325px;
			width: 90%;
		}

		.supplier .system-explain .inner ul .left img {
			margin-top: -23px;
		}

		.supplier .system-explain .inner ul .center img {
			margin-top: 25px;
		}

		.supplier .system-explain .inner ul .right img {
			margin-top: -7px;
		}

		.supplier .system-explain .inner ul .text-box {
			background-color: #ffffff;
			border-radius: 0 0 5px 5px;
			padding: 25px 0;
			max-width: 325px;
			width: 90%;
		}

		.supplier .system-explain .inner ul .left div {
			margin: 0 auto 0 0;
		}

		.supplier .system-explain .inner ul .center div {
			margin: 0 auto;
		}

		.supplier .system-explain .inner ul .right div {
			margin: 0 0 0 auto;
		}

		.supplier .system-explain .inner ul .text-box .title {
			font-size: 18px;
			font-size: 1.28rem;
			font-weight: bold;
			text-align: center;
		}

		.supplier .system-explain .inner ul .text-box .text {
			font-size: 15px;
			font-size: 1.07rem;
			margin-top: 5px;
			text-align: center; 
		}
}

/* TABLET */
@media screen and (max-width: 969px) and (min-width: 671px) {
		.supplier .system-explain {
			background-color: #bbe7fe;
			padding: 60px 0;
		}

		.supplier .system-explain .inner {
			margin: 0 auto;
			max-width: 1130px;
			width: 98%;
		}

		.supplier .system-explain .inner ul {
			margin: 60px auto 0;
			max-width: 1130px;
			width: 98%;
		}

		.supplier .system-explain .inner ul .left {
			float: left;
			width: 33.3%;
		}

		.supplier .system-explain .inner ul .center {
			float: left;
			width: 33.3%;
		}

		.supplier .system-explain .inner ul .right {
			float: left;
			width: 33.3%;
		}

		.supplier .system-explain .inner ul .img-box {
			background-color: #f1fbff;
			border-radius: 5px 5px 0 0;
			height: 145px;
			text-align: center;
			max-width: 325px;
			width: 94%;
		}

		.supplier .system-explain .inner ul .left img {
			height: 170px;
			margin-top: -25px;
		}

		.supplier .system-explain .inner ul .center img {
			height: 100px;
			margin-top: 25px;
		}

		.supplier .system-explain .inner ul .right img {
			height: 140px;
			margin-top: -7px;
		}

		.supplier .system-explain .inner ul .text-box {
			background-color: #ffffff;
			border-radius: 0 0 5px 5px;
			box-sizing: border-box;
			padding: 15px 5px;
			max-width: 325px;
			width: 94%;
		}

		.supplier .system-explain .inner ul .left div {
			margin: 0 auto 0 0;
		}

		.supplier .system-explain .inner ul .center div {
			margin: 0 auto;
		}

		.supplier .system-explain .inner ul .right div {
			margin: 0 0 0 auto;
		}

		.supplier .system-explain .inner ul .text-box .title {
			font-size: 14px;
			font-size: 1rem;
			font-weight: bold;
			text-align: center;
		}

		.supplier .system-explain .inner ul .text-box .text {
			font-size: 13px;
			font-size: 0.93rem;
			margin-top: 5px;
			text-align: center; 
		}
}

/* SP */
@media screen and (max-width: 670px) {
		.supplier .system-explain {
			background-color: #bbe7fe;
			padding: 60px 0;
		}

		.supplier .system-explain .inner {
			margin: 0 auto;
			max-width: 1130px;
			width: 98%;
		}

		.supplier .system-explain h2 {
			font-size: 1.42rem;
			margin-bottom: 30px;
		}

		.supplier .system-explain .inner ul {
			margin: 60px auto 0;
			max-width: 1130px;
			width: 98%;
		}

		.supplier .system-explain .inner ul li {
			float: none;
			margin: 0 auto 40px;
			width: 98%;
		}

		.supplier .system-explain .inner ul li:last-child {
			margin-bottom: 0;
		}

		.supplier .system-explain .inner ul .img-box {
			background-color: #f1fbff;
			border-radius: 5px 5px 0 0;
			height: 145px;
			text-align: center;
			max-width: 325px;
			margin: 0 auto;
			width: 94%;
		}

		.supplier .system-explain .inner ul .left img {
			height: 170px;
			margin-top: -25px;
		}

		.supplier .system-explain .inner ul .center img {
			height: 100px;
			margin-top: 25px;
		}

		.supplier .system-explain .inner ul .right img {
			height: 140px;
			margin-top: -7px;
		}

		.supplier .system-explain .inner ul .text-box {
			background-color: #ffffff;
			border-radius: 0 0 5px 5px;
			padding: 25px 0;
			max-width: 325px;
			margin: 0 auto;
			width: 94%;
		}


		.supplier .system-explain .inner ul .text-box .title {
			font-size: 1.14rem;
			font-weight: bold;
			text-align: center;
		}

		.supplier .system-explain .inner ul .text-box .text {
			font-size: 0.93rem;
			margin-top: 5px;
			text-align: center; 
		}
}

/* -------------------
	useful-func
-------------------- */
.supplier .useful-func {
	text-align: center;
	background-color: #ffffff;
	padding: 60px 0;
}

.supplier .useful-func h2 {
	font-size: 1.42rem;
	margin-bottom: 30px;
}

.supplier .useful-func h2 span {
	display: block;
}

.supplier .useful-func .inner {
	margin: 0 auto;
	position: relative;
	width: 90%;
}

.supplier .useful-func .inner ul {
	list-style: none;
}

.supplier .useful-func .inner ul li {
	margin-bottom: 45px;
}

.supplier .useful-func .inner ul li:last-child {
	margin-bottom: 0;
}

.supplier .useful-func .inner ul li > div {
	width: 90%;
}

.supplier .useful-func .inner ul li .box1 div img {
	width: 130px;
}

.supplier .useful-func .inner ul li .box2 div img {
	width: 80px;
}

.supplier .useful-func .inner ul li .box3 div img {
	width: 110px;
}

.supplier .useful-func .inner ul li .box4 div img {
	width: 76px;
}

.supplier .useful-func .inner ul li .box5 div img {
	width: 72px;
}

.supplier .useful-func .inner ul li .box6 div img {
	width: 90px;
}

.supplier .useful-func .inner ul li div {
	margin: 0 auto;
}

.supplier .useful-func .inner ul li > div > div {
	margin-bottom: 25px;
}

.supplier .useful-func .inner ul li h3 {
	margin: 0 auto 10px;
	font-size: 1.21rem;
	color: #7ac3e9;
}

.supplier .useful-func .inner ul li h3 span {
	display: block;
	line-height: 1.2;
}

.supplier .useful-func .inner ul li h3 img {
	width: 55px;
	margin: -5px 0 0 6px;
}

.supplier .useful-func .inner ul li p {
	text-align: left;
	font-size: 1rem;
}

@media only screen and (min-width: 670px){
		.supplier .useful-func {
			padding: 70px 0 10px;
		}

		.supplier .useful-func h2 {
			font-size: 30px;
			font-size: 2.14rem;
			margin-bottom: 50px;
		}

		.supplier .useful-func h2 span {
			display: inline;
		}

		.supplier .useful-func .inner ul li {
			width: 50%;
			height: 210px;
			height: 15rem;
			float: left;
			margin-bottom: 30px;
		}

		.supplier .useful-func .inner ul li:last-child {
			margin-bottom: 30px;
		}

		.supplier .useful-func .inner ul li > div {
			max-width: 280px;
		}

		.supplier .useful-func .inner ul li > div > div {
			height: 110px;
			margin-bottom: 0;
		}

		.supplier .useful-func .inner ul li h3 {
			margin: 5px auto 10px;
			font-size: 1.21rem;
		}

		.supplier .useful-func .inner ul li .box1 h3 {
			margin: 0 0 10px -40px;
			width: 330px;
		}

		.supplier .useful-func .inner ul li h3 span {
			display: inline;
		}
}

@media only screen and (min-width: 970px){
		.supplier .useful-func {
			padding: 70px 0 35px;
		}

		.supplier .useful-func h2 {
			margin-bottom: 50px;
		}

		.supplier .useful-func .inner {
			width: 96%;
			max-width: 1070px;
		}

		.supplier .useful-func .inner ul {

		}

		.supplier .useful-func .inner ul li {
			width: 33.3%;
			float: left;
		}

		.supplier .useful-func .inner ul li > div {
			min-width: 310px;
		}

		.supplier .useful-func .inner ul li .box1,
		.supplier .useful-func .inner ul li .box4
		 {
			margin: 0 auto 0 0;
		}

		.supplier .useful-func .inner ul li .box2,
		.supplier .useful-func .inner ul li .box5 {
			margin: 0 auto;
		}

		.supplier .useful-func .inner ul li .box3,
		.supplier .useful-func .inner ul li .box6 {
			margin: 0 0 0 auto;
		}

		.supplier .useful-func .inner ul li > div > div {
			height: 100px;
		}

		.supplier .useful-func .inner ul li h3 {
			margin: 0 auto 20px;
			font-size: 18px;
			font-size: 1.28rem;
		}

		.supplier .useful-func .inner ul li .box1 h3 {
			margin: 0 0 20px -25px;
			width: 350px;
		}

		.supplier .useful-func .inner ul li .box1 h3 span {
			line-height: 1;
		}

		.supplier .useful-func .inner ul li .box4 h3,
		.supplier .useful-func .inner ul li .box5 h3,
		.supplier .useful-func .inner ul li .box6 h3 {
			margin-top: 13px;
		}

		.supplier .useful-func .inner ul li p {
			font-size: 15px;
			font-size: 1.07rem;
		}

}

/* -------------------
	questions
-------------------- */
@media screen and (max-width: 670px) {
	.supplier .questions {
		text-align: center;
		background-color: #85c9ed;
		padding: 60px 0;
		color:#ffffff;
	}
	.supplier .questions h2 {
		font-size: 1.6rem;
		margin-bottom: 40px;
		color: #ffffff;
	}
	.supplier .questions h2 span {
		display: inline-block;
	}
	.supplier .questions .inner {
		margin: 0 auto;
		width:90%;
		max-width:auto;
	}
	.supplier .questions .inner ul {
		margin:0 auto;
		width:100%;
	}
	.supplier .questions .inner ul li {
		margin-bottom: 20px;
	}
	.supplier .questions .inner ul li .question {
		width:100%;
		float:left;
		position: relative;
	}
	.supplier .questions .inner ul li .question .num {
		border:#ffffff 2px solid;
		padding:4px 8px;
		float:left;
		font-size:1.1rem;
		position: absolute;
	}
	.supplier .questions .inner ul li .question p {
		float:left;
		padding:0 10px 0.5% 10px;
		font-size: 1.1rem;
		font-weight:bold;
		text-align:left;
		margin-left:14%
	}
	.supplier .questions .inner ul li .answer {
		float:left;
		background-color:#ffffff;
		color:#4d4d4d;
		text-align:left;
		width:100%;
		border-radius: 5px;
		margin-top:5%;
	}
	.supplier .questions .inner ul li .answer p {
		float:left;
		padding:15px 15px;
		font-size:1.08rem;
		position: relative;
	}
	.supplier .questions .inner ul li .answer p br {
		display:none;
	}
	.supplier .questions .inner ul li .answer p .marker{
		/* IE 8+ */
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffff00', GradientType=0)";
		/* IE 10 */
		background: -ms-linear-gradient(#ffffff 40%, #ffff00 60%);
		background: -webkit-linear-gradient(top,#ffffff 40%, #ffff00 60%);
		background: linear-gradient(to bottom #ffffff 40%, #ffff00 60%);
	}
	.supplier .questions .inner ul li .answer p span {
		display:initial;
	}
	.supplier .questions .inner ul li .answer p .cur1 {
		position:absolute;
		left:-11px;
		width:12px;
		display:none;
	}
	.supplier .questions .inner ul li .answer p .cur2 {
		position:absolute;
		left:18px;
		top:-9px;
		width:11px;
		display:block;
	}
}

@media only screen and (min-width: 671px) and (max-width: 970px){
	.supplier .questions {
		text-align: center;
		background-color: #85c9ed;
		padding: 60px 0;
		color:#ffffff;
	}
	.supplier .questions h2 {
		font-size: 2.14rem;
		margin-bottom: 40px;
		color: #ffffff;
	}
	.supplier .questions h2 span {
		display: inline;
	}
	.supplier .questions .inner {
		margin: 0 auto;
		width:98%;
		max-width:520px;
	}
	.supplier .questions .inner ul {
		margin:0 auto;
		width:450px;
	}
	.supplier .questions .inner ul li {
		margin-bottom: 20px;
	}
	.supplier .questions .inner ul li .question {
		width:470px;
		float:left;
	}
	.supplier .questions .inner ul li .question .num {
		border:#ffffff 2px solid;
		padding:3px 12px;
		float:left;
		font-size:1.4rem;
	}
	.supplier .questions .inner ul li .question p {
		float:left;
		padding:10px;
		font-size: 1.2rem;
		font-weight:bold;
		text-align:left;
	}
	.supplier .questions .inner ul li .answer {
		float:left;
		background-color:#ffffff;
		color:#4d4d4d;
		max-width:450px;
		text-align:left;
		width:100%;
		border-radius: 5px;
		margin-top:15px;
	}
	.supplier .questions .inner ul li .answer p {
		float:left;
		padding:15px 30px;
		font-size:1.08rem;
		position: relative;
	}
	.supplier .questions .inner ul li .answer p br {
		display:none;
	}
	.supplier .questions .inner ul li .answer p .marker{
		/* IE 8+ */
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffff00', GradientType=0)";
		/* IE 10 */
		background: -ms-linear-gradient(#ffffff 40%, #ffff00 60%);
		background: -webkit-linear-gradient(top,#ffffff 40%, #ffff00 60%);
		background: linear-gradient(to bottom #ffffff 40%, #ffff00 60%);
	}
	.supplier .questions .inner ul li .answer p span {
		display:initial;
	}
	.supplier .questions .inner ul li .answer p .cur1 {
		position:absolute;
		left:-11px;
		width:12px;
		display:none;
	}
	.supplier .questions .inner ul li .answer p .cur2 {
		position:absolute;
		left:26px;
		top:-9px;
		width:11px;
		display:block;
	}
}

@media only screen and (min-width: 971px){
	.supplier .questions {
		text-align: center;
		background-color: #85c9ed;
		padding: 70px 0;
		color:#ffffff;
	}
	.supplier .questions h2 {
		font-size: 2.14rem;
		margin-bottom: 40px;
		color: #ffffff;
	}
	.supplier .questions h2 span {
		display: inline;
	}
	.supplier .questions .inner {
		margin: 0 auto;
		width:98%;
		max-width:950px;
	}
	.supplier .questions .inner ul {
		margin:0 auto;
		width:auto;
	}
	.supplier .questions .inner ul li {
		margin-bottom: 20px;
	}
	.supplier .questions .inner ul li .question {
		width:470px;
		float:left;
	}
	.supplier .questions .inner ul li .question .num {
		border:#ffffff 2px solid;
		padding:3px 12px;
		float:left;
		font-size:1.4rem;
	}
	.supplier .questions .inner ul li .question p {
		float:left;
		padding:8px;
		font-size: 1.2rem;
		font-weight:bold;
		text-align:left;
	}
	.supplier .questions .inner ul li .answer {
		float:left;
		background-color:#ffffff;
		color:#4d4d4d;
		max-width:450px;
		text-align:left;
		width:100%;
		border-radius: 5px;
		margin-top:0px;
	}
	.supplier .questions .inner ul li .answer p {
		float:left;
		padding:15px 30px;
		font-size:1.06rem;
		position: relative;
	}
	.supplier .questions .inner ul li .answer p br {
		display:block;
	}
	.supplier .questions .inner ul li .answer p .marker{
		/* IE 8+ */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffff00', GradientType=0)";
	/* IE 10 */
		background: -ms-linear-gradient(#ffffff 40%, #ffff00 60%);
		background: -webkit-linear-gradient(top,#ffffff 40%, #ffff00 60%);
		background: linear-gradient(to bottom #ffffff 40%, #ffff00 60%);
	}
	.supplier .questions .inner ul li .answer p span {
		display:inline-flex;
	}
	.supplier .questions .inner ul li .answer p .cur1 {
		position:absolute;
		left:-11px;
		width:12px;
		display:block;
	}
	.supplier .questions .inner ul li .answer p .cur2 {
		position:absolute;
		left:-11px;
		width:11px;
		display:none;
	}
}

/* -------------------
	example
-------------------- */
.supplier .example {
	text-align: center;
	background: url(/img/prelogin/bg_example.png) #e9e7e1 repeat-x; background-position: bottom;
	padding: 60px 0 120px;
}
.supplier .example .inner {
	max-width: none;
	overflow: hidden;
	width: 100%;
}
.supplier .example .inner h2 {
	font-size: 1.42rem;
	margin-bottom: 30px;
	line-height: 1.2;
}
.supplier .example .inner h2 .lb-sp {
	display: block;
}
.supplier .example .inner .bx-wrapper {
	max-width: 100% !important;
}
.supplier .example .inner .slide-all {
	height: 460px;
	position: relative;
}
.supplier .example .inner .slide-wrap {
  left: 50%;
  margin-left: -395px;
  position: absolute;
  width: 850px;
}
.supplier .example .inner .slide {
	margin-right: 14px !important;
	width: 254px !important;
}
.supplier .example .inner .slide a {
	background-color: #ffffff;
	border-radius: 5px;
	color: #333333;
	display: block;
	height: 425px;
	padding: 15px;
  position: relative;
}
.supplier .example .inner .slide a:hover {
	text-decoration: none;
}
.supplier .example .inner .slide a:hover .category {
	text-decoration: underline;
}
.supplier .example .inner .slide .shop-name {
	margin: 13px 0 23px;
	text-align: center;
	color: #85c9ed;
	font-size: 1.07rem;
	line-height: 1;
}
.supplier .example .inner .slide .shop-name span {
	display: block;
	margin-top: 5px;
}
.supplier .example .inner .slide .category {
	color: #85c9ed;
  font-size: 1.07rem;
	font-weight: bold;
	line-height: 1.5;
	margin-bottom: 20px;
	text-align: center;
}
.supplier .example .inner .slide .category span {
	display: block;
}
.supplier .example .inner .slide .explain {
	font-size: 1.07rem;
	text-align: left;
}
.supplier .example .inner .slide .show-detail {
	bottom: 25px;
	color: #3893ee;
	position: absolute;
	right: 15px;
	text-align: right;
}
.supplier .example .inner .slide .show-detail img {
	margin-right: 5px;
}

/* tablet */
@media only screen and (min-width: 670px){
	.supplier .example {
		padding: 70px 0 130px;
	}
	.supplier .example .inner h2 {
		font-size: 30px;
		font-size: 2.14rem;
		margin-bottom: 50px;
	}
	.supplier .example .inner h2 .lb-sp {
		display: inline;
	}
	.supplier .example .inner h2 .lb-tb {
		display: block;
	}
	.supplier .example .inner .slide {
		margin-right: 30px !important;
		width: 270px !important;
	}
	.supplier .example .inner .slide a {
		padding: 15px;
	}
	.supplier .example .inner .bx-wrapper {
		max-width: 100% !important;
	}
	.supplier .example .inner .slide-all {
		height: 460px;
		position: relative;
	}
	.supplier .example .inner .slide-wrap {
		left: 50%;
		margin-left: -435px;
		position: absolute;
		width: 870px;
	}
	.supplier .example .inner .slide .shop-name {
		margin: 13px 0 23px;
		font-size: 0.92rem;
	}
	.supplier .example .inner .slide .category {
		margin-bottom: 15px;
	}
	.supplier .example .inner .slide .category span {
		display: inline;
	}
	.supplier .example .inner .slide .explain {
		font-size: 1rem;
		text-align: left;
	}
}

/* PC */
@media only screen and (min-width: 970px){
	.supplier .example .inner h2 .lb-sp,
	.supplier .example .inner h2 .lb-tb {
		display: inline;
	}
	.supplier .example .inner .slide-all {
		height: 480px;
		position: relative;
	}
	.supplier .example .inner .slide-wrap {
		left: 50%;
		margin-left: -585px;
		position: absolute;
		width: 1170px;
	}
	.supplier .example .inner .bx-wrapper {
		max-width: 100% !important;
	}
	.supplier .example .inner .slide {
		margin-right: 40px !important;
		width: 360px !important;
		float: none !important;
		display: inline-block !important;
	}
	.supplier .example .inner .slide a {
		padding: 25px;
	}
	.supplier .example .inner .slide .shop-name {
		font-size: 15px;
		font-size: 1.07rem;
	}
	.supplier .example .inner .slide .shop-name span {
		display: inline;
	  font-size: 13px;
    font-size: 0.92rem;
	}
	.supplier .example .inner .slide .category {
		font-size: 17px;
		font-size: 1.21rem;
    height: 2.8em;
	}
	.supplier .example .inner .slide .explain {
		font-size: 15px;
		font-size: 1.07rem;
    height: 6em;
	}
}

/* bxslider用設定 */
/** RESET AND LAYOUT
===================================*/
.example .inner .bx-wrapper {
  position: relative;
  margin: 0 auto;
  padding: 0;
  *zoom: 1;
}
.example .inner .bx-wrapper img {
  max-width: 100%;
}

/** THEME
===================================*/
/* DIRECTION CONTROLS (NEXT / PREV) */
.example .inner .slide-controller {
    display: none;
}
@media only screen and (min-width: 970px){
	/* DIRECTION CONTROLS (NEXT / PREV) */
	.example .inner .slide-controller {
	  display: block;
	  height: 81px;
	  margin: -80px auto 0;
	  max-width: 1340px;
	  position: relative;
	  width: 100%;
	}
	.example .inner .slide-controller a {
	  position: absolute;
	  outline: 0;
	  display: block;
	  width: 81px;
	  height: 81px;
	  text-indent: -9999px;
	  z-index: 9999;
	}
	.example .inner .slide-controller a.disabled {
	  display: none;
	}
	.example .inner .slide-prev {
	  display: block;
	  left: 10px;
	  background:  url(/img/prelogin/img_arrow_prev.png) right no-repeat;
	  height: 81px;
	  width: 81px;
	  position: absolute;
	  top: 270px;
	  z-index: 30;
	  cursor: pointer;
	}
	.example .inner .slide-next {
	  display: block;
	  right: 10px;
	  background:  url(/img/prelogin/img_arrow_next.png) left no-repeat;
	  height: 81px;
	  width: 81px;
	  position: absolute;
	  top: 270px;
	  z-index: 30;
	  cursor: pointer;
	}
	.example .inner .slide-prev:hover {
	  background: url(/img/prelogin/img_arrow_prev_hover.png) left no-repeat !important;
	  transition: All 0.5s ease;
	}
	.example .inner .slide-next:hover {
	  background: url(/img/prelogin/img_arrow_next_hover.png) right no-repeat !important;
	  transition: All 0.5s ease;
	}
}

/* -------------------
	charge
-------------------- */
.supplier .charge {
	text-align: center;
	background-color: #ffffff;
	padding: 60px 0;
}

.supplier .charge .inner {
	margin: 0 auto;
	position: relative;
	width: 100%;
}

.supplier .charge .inner h2 {
	font-size: 1.42rem;
}

.supplier .charge .inner h2 span {
	font-size: 2rem;
}

.supplier .charge .sub-title {
	margin: 30px 0 95px;
	line-height: 1.3;
	font-size: 1.14rem;
}

.supplier .charge .sub-title span {
	display: block;
}

.supplier .charge .inner ul {
	list-style: none;
}

.supplier .charge .inner > ul {
	margin: 0 auto 30px;
}

.supplier .charge .inner > ul > li {
	position: relative;
}

.supplier .charge .inner .plan {
	width: 94%;
	max-width: 330px;
	margin: 0 auto;
}

.supplier .charge .inner .free {
	border: solid 2px #cccccc;
	margin-bottom: 80px;
}

.supplier .charge .inner .business {
	border: solid 2px #9dd4f1;
}

.supplier .charge .inner .free .plan-box {
	padding: 55px 0 20px;
	position: relative;
	background-color: #eeeeee;
}

.supplier .charge .inner .business .plan-box {
	padding: 55px 0 20px;
	position: relative;
	background-color: #e6f5fd;
}

.supplier .charge .inner .icon-outer-free {
	width: 109px;
	height: 109px;
	position: absolute;
	left: 50%;
	margin-left: -57px;
	top: -55px;
	border-radius: 50%;
	background-color: #cccccc;
}

.supplier .charge .inner .icon-outer-business {
	width: 109px;
	height: 109px;
	position: absolute;
	left: 50%;
	margin-left: -57px;
	top: -55px;
	border-radius: 50%;
	background-color: #9dd4f1;
}

.supplier .charge .inner .icon-box {
	position: absolute;
	left: 50%;
	margin-left: -55px;
	top: -55px;
	border-radius: 50%;
	padding: 10px;
}

.supplier .charge .inner div .icon-box img	{
	width: 85px;
	height: 85px;
}

.supplier .charge .inner .free > div .icon-box	{
	background-color: #eeeeee;
}

.supplier .charge .inner .business > div .icon-box	{
	background-color: #e6f5fd;
}

.supplier .charge .inner .flag-box {
	position: absolute;
	top: 20px;
	left: 50%;
	margin-left: -40px;
}

.supplier .charge .inner .flag-box img {
	width: 80px;
}

.supplier .charge .inner .plan-box .plan-name {
	font-size: 1.21rem;
	font-weight: bold;
	line-height: 1;
}

.supplier .charge .inner .business .plan-name {
	color: #85c9ed;
}

.supplier .charge .inner .plan-box .plan-text {
	font-size: 1.07rem;
	line-height: 1;
	margin: 10px 0 15px;
}

.supplier .charge .inner .plan-box .plan-charge {
	line-height: 1;
	margin: 0 auto;
}

.supplier .charge .inner .plan-box .plan-charge > span {
	border-bottom: solid 1px #4d4d4d;
	padding: 0 5px;
	font-size: 15px;
}

.supplier .charge .inner .free .plan-charge > span {
	padding: 0 15px;
}

.supplier .charge .inner .plan-box .plan-charge .yen {
	font-size: 31px;
	font-size: 1.5rem;
}

.supplier .charge .inner .plan-box .plan-charge .amount {
	font-size: 41px;
	font-size: 2.14rem;
}

.supplier .charge .inner .sub-box {
	padding: 15px;
	background-color: #ffffff;
}

.supplier .charge .inner .free .sub-box .sub-catch {
	font-size: 15px;
	font-size: 1.07rem;
	font-weight: bold;
	color: #a5a5a5;
	line-height: 1;
	text-align: center;
}

.supplier .charge .inner .business .sub-box .sub-catch {
	font-size: 15px;
	font-size: 1.07rem;
	font-weight: bold;
	color: #9dd4f1;
	line-height: 1;
	text-align: center;
}

.supplier .charge .inner .plan ul {
	margin-top: 15px;
	font-size: 13px;
	font-size: 0.92rem;
}

.supplier .charge .inner .free ul li {
	list-style: none;
	margin-top: 10px;
	background: url(/img/prelogin/icon_check_free.png) no-repeat;
	background-size: 17px;
	background-position: 2px 2px;
	background: url(/img/prelogin/icon_check_free_s.png) no-repeat\9 /* ie8 */;
	padding: 0 0 4px 25px;
	line-height: 22px;
	border-bottom: solid 1px #dadada;
}

.supplier .charge .inner .business ul li {
	list-style: none;
	margin-top: 10px;
	background: url(/img/prelogin/icon_check_business_sup.png) no-repeat;
	background-size: 17px;
	background-position: 2px 2px;
	background: url(/img/prelogin/icon_check_business_sup_s.png) no-repeat\9 /* ie8 */;
	padding: 0 0 4px 25px;
	line-height: 22px;
	border-bottom: solid 1px #d4f0fe;
}

.supplier .charge .inner .plan ul li:first-child {
	margin-top: 0;
}

.supplier .charge .inner .show-detail {
	padding-top: 10px;
	padding-right: 10px;
	border-top: dashed 1px #cccccc;
	text-align: right;
}

@media only screen and (min-width: 670px){
		.supplier .charge {
			padding: 70px 0;
		}
		.supplier .charge .inner h2 {
			font-size: 30px;
			font-size: 2.14rem;
		}

		.supplier .charge .inner h2 span {
			font-size: 3rem;
		}

		.supplier .charge .sub-title {
		  font-size: 1.35rem;
		}

		.supplier .charge .sub-title span {
			display: inline;
		}

		.supplier .charge .inner > ul > li {
			width: 50%;
			float: left;
		}
}
@media only screen and (min-width: 970px){
		.supplier .charge h2 span {
		  font-size: 4.07rem;
		}

		.supplier .charge .sub-title {
		  margin: 30px 0 95px;
		  font-size: 21px;
		  font-size: 1.5rem;
		  line-height: 1;
		}

		.supplier .charge .inner {
		  max-width: 1070px;
		}

		.supplier .charge .inner > ul {
		  width: 810px;
		}

		.supplier .charge .inner .plan {
		  width: 350px;
		  max-width: none;
		}

		.supplier .charge .inner .free .plan-box,
		.supplier .charge .inner .business .plan-box {
			padding: 70px 0 30px;
		}

		.supplier .charge .inner .free {
		  margin: 0 auto 0 0;
		}

		.supplier .charge .inner .business {
		  margin: 0 0 0 auto;
		}

		.supplier .charge .inner .icon-outer-free {
		  left: 175px;
		  margin-left: -53px;
		  top: -53px;
		}

		.supplier .charge .inner .icon-outer-business {
		  left: 226px;
		  margin-left: -53px;
		  top: -53px;
		}

		.supplier .charge .inner .icon-box {
		  left: 175px;
		  margin-left: -53px;
		  top: -53px;
		}

		.supplier .charge .inner .plan-box .plan-text {
		  font-size: 1.07rem;
		  margin: 13px 0 20px;
		}

		.supplier .charge .inner .free .plan-charge > span {
		  padding: 0 20px;
		  margin: 0 auto;
		}

		.supplier .charge .inner .business .plan-charge {
		  margin: 0 auto;
		}

		.supplier .charge .inner .plan-box .plan-charge .yen {
		  font-size: 2.21rem;
		}

		.supplier .charge .inner .plan-box .plan-charge .amount {
		  font-size: 2.92rem;
		}

		.supplier .charge .inner .sub-box {
			padding: 25px;
		}

		.supplier .charge .inner .free .sub-box .sub-catch {
			font-size: 17px;
			font-size: 1.21rem;
		}

		.supplier .charge .inner .business .sub-box .sub-catch {
			font-size: 17px;
			font-size: 1.21rem;
		}

		.supplier .charge .inner .plan-box .plan-name {
			font-size: 23px;
			font-size: 1.64rem;
		}

		.supplier .charge .inner .plan ul {
			margin-top: 15px;
			font-size: 1.07rem;
		}

		.supplier .charge .inner .plan ul li:first-child {
			margin-top: 0;
		}

		.supplier .charge .inner .show-detail {
			padding-right: 0;
		}
}



/* -------------------
	signup
 -------------------*/

.supplier .signup {
	background:#e9e7e1 url("/img/prelogin/bg_club_buy.png") 0 -20% repeat;
}

.supplier .signup .catch {
	font-size: 1.2rem;
	line-height: 1.3;
	margin-bottom: 30px;
}

.supplier .signup .catch span:first-child {
	font-weight: bold;
}

.supplier .signup .catch span:last-child {
	display: block;
}

.supplier .signup h2{
	color:#85c9ed;
}

.supplier .signup .signup-btn span input {
	background-image: -moz-linear-gradient(center top , #7ec7ed, #5facd3);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #5facd3),color-stop(1, #7ec7ed));
	background: -ms-linear-gradient(top, #7ec7ed 0%, #5facd3 100%);
	background: linear-gradient(top, #7ec7ed 0%, #5facd3 100%);
}
.supplier .signup .signup-btn span input:hover {
	background-image: -moz-linear-gradient(center top , #5facd3, #5facd3);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #5facd3),color-stop(1, #5facd3));
	background: -ms-linear-gradient(top, #5facd3 0%, #5facd3 100%);
	background: linear-gradient(top, #5facd3 0%, #5facd3 100%);
}

.supplier .bp-txt {
	margin-top: 20px;
	font-size: 15px;
}

.supplier .bp-txt span {
	display: block;
}

@media only screen and (min-width: 670px){
		.supplier .signup .catch {
			font-size: 21px;
			font-size: 1.5rem;
		}
		.supplier .bp-txt span {
			display: inline;
		}
}

@media only screen and (min-width: 970px){
		.supplier .signup .catch span:last-child {
			display: inline;
		}
}

/* キャンペーン文言用 */
.supplier .signup .campaign-1007 {
	font-size:0.9rem;
	padding:10px 15px;
	background-color:#fffae7;
	text-align:left;
	margin:0 5%;
	border-radius: 5px;
}
.supplier .signup .campaign-1007 .small {
	font-size:0.8rem;
}

@media only screen and (min-width: 670px){
	.supplier .signup .campaign-1007 {
		font-size:0.9rem;
		padding:10px 15px;
		background-color:#fffae7;
		width:510px;
		text-align:left;
		margin:0 auto;
		border-radius: 5px;
	}
	.supplier .signup .campaign-1007 .small {
		font-size:0.8rem;
	}
}
/* キャンペーン文言用 */


.supplier #page-top {
	z-index: 10;
}


/* -------------------------------------------------------------------
 plan
---------------------------------------------------------------------*/

.plan .main-contents {
	max-width: 1090px;
	padding-top: 4em;
}

.plan h1 {
	text-align: center;
	margin-bottom: 0;
	font-size: 21px;
}

.plan .sub-catch {
	text-align: left;
	font-size: 16px;
}

.plan .sub-catch .zero {
	font-size: 21px;
}

.plan .sub-catch .wb {
	display: inline;
}

.plan .table-wrap {
	margin-top: 30px;
}

.plan .plan-list table{
	background-color:#fff;
	border-collapse:collapse;
	width:100%;
	font-size:11px;
}

.plan .plan-list th{
	border-top:2px solid #f3f2ef;
	border-bottom:2px solid #f3f2ef;
	border-left:5px solid #f3f2ef;
	border-right:5px solid #f3f2ef;
	vertical-align:middle;
	text-align:left;
	padding:1em;
	font-weight:normal;
}

.plan .plan-list td{
	border-top:2px solid #f3f2ef;
	border-bottom:2px solid #f3f2ef;
	border-left:5px solid #f3f2ef;
	border-right:5px solid #f3f2ef;
	vertical-align:middle;
	text-align:center;
}

.plan .charge-plan {
	margin-top: -3.5em;
	padding-top: 3.5em;
}

.plan .plan-list .h-sup {
	background-color: #f3f2ef;
	padding: 0;
	vertical-align: top;
	font-size: 12px;
}

.plan .plan-list .h-sup-inner {
	border-left:5px solid #85c9ed;
	text-align:left;
	padding:0.5em;
	font-weight:bold;
}

.plan .plan-list .h-buy {
	background-color:#f3f2ef;
	padding:0;
	vertical-align: top;
	font-size: 12px;
}

.plan .plan-list .h-buy-inner {
	border-left:5px solid #df920b;
	text-align:left;
	padding:0.5em;
	font-weight:bold;
}

.plan .plan-list .h-sup h2 {
	font-size: 1em;
	line-height: 1em;
	font-weight: normal;
}

.plan .plan-list .h-buy h2 {
	font-size: 1em;
	line-height: 1em;
	font-weight: normal;
}

.plan .plan-list .h-free{
	width:30%;
	background-color:#e5e5e5;
	padding:1em 0 0.4em;
}

.plan .plan-list .h-free .plan-name {
	font-weight: bold;
}

.plan .plan-list .h-business-sup{
	width:30%;
	min-height: 48px;
	background-color: #e6f5fd;
	color: #85c9ed;
}

.plan .plan-list .h-business-buy{
	width:30%;
	min-height: 48px;
	background-color: #f9e6c3;
	color: #df920b;
}

.plan .plan-list .h-business-buy div {
	min-height: 30px;
	border: solid 2px #e7ad48;
	padding: 9px 0;
}

.plan .plan-list .h-business-sup div {
	min-height: 30px;
	border: solid 2px #9dd4f1;
	padding: 9px 0;
}

.plan .plan-list .h-business-buy div > span {
	font-weight: bold;
}

.plan .plan-list .h-business-sup div > span {
	font-weight: bold;
}

.plan .plan-list .h-business-buy div .wb {
	display: block;
}

.plan .plan-list .h-business-sup div .wb {
	display: block;
}

.plan .plan-list .h-business-sup p,
.plan .plan-list .h-business-buy p {
	color: #4d4d4d;
}

.plan .plan-list td img{
	max-width:15px;
}

.plan .plan-list td img.plan-flag {
	max-width: 40px;
	margin-left: 5px;
}

/* singup */

.plan .signup {
	background:#e9e7e1 url("/img/prelogin/bg_club_buy.png") 0 -20% repeat;
}

.plan .signup .catch {
	font-size: 1.21rem;
	line-height: 1.3;
	margin-bottom: 30px;
}

.plan .signup .catch span:first-child {
	font-weight: bold;
}

.plan .signup .catch span:last-child {
	display: block;
}

.plan .bp-txt {
	margin-top: 20px;
	font-size: 15px;
}

.plan .bp-txt span {
	display: block;
}

@media only screen and (min-width: 670px){

		.plan .main-contents {
			padding-top: 5.5em;
		}

		.plan .container-frame {
			background-color:#fff;
		}

		.plan .plan-list {
			background-color:#fff;
		}

		.plan h1 {
			font-size: 30px;
		}
		.plan .sub-catch {
			text-align: center;
		}

		.plan .sub-catch .wb {
			display: block;
		}

		.plan .table-wrap {
			padding: 30px 40px;
			margin-top: 30px;
			border: solid 1px #e9e7e1;
			border-radius: 10px;
			background-color: #f3f2ef;
		}

		.plan .table-wrap:last-child {
			margin-top: 50px;
		}

		.plan .plan-list table {
			font-size:14px;
		}

		.plan .plan-list .fax-times {
			height: 5.5em;
			position: relative;
		}

		.plan .plan-list .fax-times p {
			font-size: 11px;
			left: 50%;
			margin-left: -7.5em;
			position: absolute;
			
		}

		.plan .plan-list .h-sup,
		.plan .plan-list .h-buy {
			font-size: 17px;
		}

		.plan .plan-list .h-free{
			font-size:16px;
		}

		.plan .plan-list .h-business-sup {
			width:30%;
			min-height: 66px;
			background-color: #e6f5fd;
			color: #85c9ed;
		}

		.plan .plan-list .h-business-buy {
			width:30%;
			min-height: 66px;
			background-color: #f9e6c3;
			color: #df920b;
		}

		.plan .plan-list .h-business-buy div {
			min-height: 48px;
			border: solid 2px #e7ad48;
			padding: 9px 0;
		}

		.plan .plan-list .h-business-sup div {
			min-height: 48px;
			border: solid 2px #9dd4f1;
			padding: 9px 0;
		}

		.plan .plan-list .h-business-buy div .wb {
			display: inline;
		}

		.plan .plan-list .h-business-sup div .wb {
			display: inline;
		}

		.plan .plan-list .fs19{
			font-size:19px;
		}

		.plan .plan-list .fs16{
			font-size:16px;
		}
		.plan .plan-list .fs13{
			font-size:13px;
		}
		.plan .plan-list .fs12{
			font-size:12px;
		}

		.plan .plan-list .fs11{
			font-size:11px;
		}

		.plan .plan-list td img.plan-flag {
			max-width: 54px;
			margin-left: 5px;
		}

		.plan .bp-txt span {
			display: inline;
		}

}

@media only screen and (min-width: 970px){

		.plan .sub-catch {
			font-size: 21px;
		}

		.plan .sub-catch .zero {
			font-size: 25px;
		}

		.plan .table-wrap {
			padding: 50px 70px;
			margin-top: 55px;
		}

		.plan .plan-list .h-business-sup{
			width:30%;
			min-height: 78px;
			background-color: #e6f5fd;
			color: #85c9ed;
		}

		.plan .plan-list .h-business-buy{
			width:30%;
			min-height: 78px;
			background-color: #f9e6c3;
			color: #df920b;
		}

		.plan .plan-list .h-business-buy div {
			border: solid 2px #e7ad48;
			padding: 10px 0;
		}

		.plan .plan-list .h-business-sup div {
			border: solid 2px #9dd4f1;
			padding: 10px 0;
		}

		/* singup */

		.plan .signup .catch span:last-child {
			display: inline;
		}
}

/* -------------------------------------------------------------------
 news
---------------------------------------------------------------------*/
.news .contents-inner{
	border-top:1px solid #ccc;
	padding:1em 0;
	margin:1em 0;
}

/* -------------------
	news-navi
 -------------------*/
.news .news-navi{
	width:100%;
	margin:0 0 250px 0;
}

.news .news-navi .white-frame{
	padding:0.25em 0.5em;
}

.news .news-navi li{
	list-style-type:none;
	padding-left:0.25em;
}

.news .news-navi .no-link{
	border-left: 3px solid #dadada;
	padding: 0.5em;
	margin: 0.45em;
}

.news .news-navi li img,
.news .news-area .date img{
	margin:0 0 0 0.5em;
	vertical-align:middle;
	max-width:50px;
}

.news .news-navi a{
	display:block;
	border-bottom:none;
	padding:0.5em;
	border-left:3px solid #dadada;
	margin:0.5em 0.25em 0.5em 0.2em;
	word-break: break-all;
}

.news .news-navi a:hover{
	border-left:3px solid #90c31f;
	background-color:#f3f2ef;
}

.news .news-navi .current a{
	border-left:3px solid #90c31f;
}


/* -------------------------------------------------------------------
 policy
---------------------------------------------------------------------*/

.policy .policy-box {
	width: 100%;
	margin: 0 auto;
	max-width: 790px;
}

.policy .policy-box .white-frame{
	padding: 10px;
	border-radius: 0;
	border: solid 1px #cccccc;
	box-shadow: none;
}

.policy .policy-box .white-frame dt{
	font-size: 15px;
	font-weight: bold;
}

.policy .policy-box .white-frame dd .url-link{
	word-break: break-all;
}

.policy .policy-box .white-frame dd div.support{
	border: 1px solid #cccccc;
}

.policy .policy-box .white-frame dd div a.co-window-link {
	padding-left: 22px;
	padding-top: 3px;
	background: url(/img/common/icon/icon_newwindow.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: inline-block;
	text-decoration: none;
}

.policy .policy-box .white-frame .num-list{
	text-indent: -1.5em;
	padding-left: 1.5em;
}

.policy .policy-box li{
	list-style-type:none;
	padding-left:0.25em;
}

.policy .policy-box .no-link{
	border-left: 3px solid #dadada;
	padding: 0.5em;
	margin: 0.45em;
}

.policy .policy-box li img,
.policy .policy-area .date img{
	margin:0 0 0 0.5em;
	vertical-align:middle;
	max-width:50px;
}

@media only screen and (min-width: 670px) {
		.policy .policy-box .white-frame{
			padding: 30px;
		}
		.policy .policy-box .white-frame dd div.support{
			width: 22em;
		}
}

/* -------------------------------------------------------------------
 contact
---------------------------------------------------------------------*/
.contact h2 {
	padding-bottom: 0;
	line-height: 1;
	margin-top: 8px;
}
.contact p.inquiry-notes {
	margin-top: -30px;
	margin-bottom: 20px;
}
.contact .white-frame {
	width: 92%;
	margin: 0 auto;
	padding: 20px 10px;
	box-shadow: 0 1px 2px #cccccc;
	border: solid 1px #cccccc;
}
.contact .white-frame em {
	border-radius: 3px;
	background-color: #ec6b6b;
	color: #ffffff;
	font-size: 11px;
	margin: 0 0 0 5px;
	padding: 1px 6px;
	font-style: normal;
}
.contact .white-frame textarea {
	vertical-align:bottom;
	font-size:13px;
}
.contact .white-frame .title {
	width:auto;
	margin-bottom:5px;
}
.contact .white-frame .conf-title {
	background: #f3f2ef;
	border-bottom: solid 1px #dadada;
	line-height: 2.5;
	padding-left: 1em;
}
.contact .white-frame .error {
	width:auto;
	margin-top:5px;
}
.contact .white-frame .prvc-txt {
	text-align: center;
	margin: 20px auto;
	font-size: 12px;
	width: 85%;
}
.contact .white-frame ul.submit {
	width: 120px;
}
.contact .white-frame .co-btn-m input {
	min-width: 120px;
	height: 40px;
	font-size: 14px;
}
.contact .white-frame a.help {
	margin-top: 5px;
	font-size: 12px;
}

/* 確認画面 */
.contact-conf .white-frame {
	width:92%;
	margin:0 auto;
	padding:20px 10px;
}
.contact-conf .white-frame ul.submit {
	width: 254px;
}
.contact-conf .white-frame ul.submit li:first-child {
	padding-left: 0;
}
.contact-conf .white-frame .co-btn-m input {
	min-width: 120px;
	height: 40px;
	font-size: 14px;
}
/* 完了画面 */
.contact-thanks .form-img {
	margin-top: 45px;
}
.contact-thanks .form-img img {
	max-width: 180px;
}

@media only screen and (min-width: 670px) {
		.contact .container-frame .main-contents {
			padding-bottom: 14em;
		}
		.contact .white-frame{
			width:80%;
			max-width:660px;
			padding:30px;
		}
		.contact .white-frame textarea {
			width:80%;
			max-width:515px;
			margin:5px 8% 0;
			padding: 0.5em 1.5%;
		}
		.contact .white-frame input[type="text"] {
			width:80%;
			max-width:330px;
			margin:5px 8% 0;
			padding: 0.5em 1.5%;
		}
		.contact .white-frame .title,
		.contact .white-frame .error {
			margin:5px 8% 0;
		}
		.contact .white-frame ul.submit {
			width: 157px;
		}
		.contact .white-frame .co-btn-m input {
			min-width: 150px;
			height: 42px;
			font-size: 15px;
		}
		.contact .white-frame a.help {
			width:80%;
			max-width:515px;
			margin: 7px 8% 1px;
			font-size: 13px;
		}
		
		/* 確認画面 */
		.contact-conf .container-frame .main-contents {
			padding-bottom: 14em;
		}
		.contact-conf .white-frame ul.submit {
			width: 324px;
		}
		.contact-conf .white-frame .co-btn-m input {
			min-width: 154px;
			height: 40px;
			font-size: 15px;
		}

		/* 完了画面 */
		.contact-thanks .container-frame .main-contents {
			padding-bottom: 16em;
		}
		.contact-thanks .form-img img {
			max-width: 100%;
		}
}

@media only screen and (min-width: 970px){
		.contact .white-frame .title,
		.contact .white-frame .error {
			width:auto;
			margin:5px 0 0 8.3%;
		}
		.contact .white-frame a.help {
			width:80%;
			max-width:515px;
			margin: 7px 8% 1px;
			font-size: 13px;
		}

		/* 確認画面 */
		.contact-conf .container-frame .main-contents {
			padding-bottom: 18em;
		}

		/* 完了画面 */
		.contact-thanks .form-img {
			margin-top: 60px;
		}
		.contact-thanks .container-frame .main-contents {
			padding-bottom: 18em;
		}
}


/* -------------------------------------------------------------------
 pw-reset
---------------------------------------------------------------------*/
.pw-reset h2 {
	padding-bottom: 0;
	line-height: 1;
	margin-top: 8px;
}
.pw-reset .white-frame {
	width:92%;
	margin:0 auto;
	padding:20px 10px;
	box-shadow: 0 1px 2px #cccccc;
	border: solid 1px #cccccc;
}
.pw-reset .pw-txt {
	text-align: left;
	font-size: 12px;
}
.pw-reset .white-frame em {
	border-radius: 3px;
	background-color: #ec6b6b;
	color: #ffffff;
	font-size: 11px;
	margin: 0 0 0 5px;
	padding: 1px 6px;
	white-space: nowrap;
	font-style: normal;
}
.pw-reset .white-frame .title {
	width: auto;
	margin: 15px 0 0;
	text-align: left;
}
.pw-reset .white-frame .error {
	margin-top: 5px;
	text-align: left;
}
.pw-reset .white-frame input[type="text"] {
	font-size:13px;
	margin-top: 5px;
}
.pw-reset .white-frame ul.submit {
	width: 254px
}
.pw-reset .white-frame ul.submit li:first-child {
	padding-left: 0;
}
.pw-reset .white-frame .co-btn-m input {
	min-width: 120px;
	height: 40px;
	font-size: 14px;
}

/* 完了画面 */
.pw-reset .form-img {
	margin-top: 45px;
}

.pw-reset .form-img img {
	max-width: 180px;
}

/* メール送信後の再設定 */
.pw-reset .white-frame .reset-txt {
	text-align: center;
	font-size: 12px;
}
.pw-reset .white-frame .reset-txt p:first-child {
	font-size: 14px;
}
.pw-reset .white-frame .submit.reset {
	width: 120px;
	margin: 30px auto 0;
}


@media only screen and (min-width: 670px){
		.pw-reset .container-frame .main-contents {
			padding-bottom: 14em;
		}
		.pw-reset .white-frame {
			width:80%;
			max-width:460px;
			padding:30px;
			text-align:center;
		}
		.pw-reset .pw-txt {
			text-align: center;
			font-size: 14px;
		}
		.pw-reset .white-frame .title {
			width: 360px;
			margin: 15px auto 5px;
			text-align: left;
		}
		.pw-reset .white-frame .error {
			width: 340px;
			margin: 5px auto 0;
			text-align: left;
		}
		.pw-reset .white-frame input[type="text"],
			.pw-reset .white-frame input[type="password"] {
			width:80%;
			max-width:330px;
		}
		.pw-reset .white-frame ul.submit {
			width: 314px
		}
		.pw-reset .white-frame .co-btn-m input {
			min-width: 150px;
			height: 42px;
			font-size: 15px;
		}

		/* メール送信後の再設定 */
		.pw-reset .white-frame .reset-txt {
			font-size: 15px;
		}
		.pw-reset .white-frame .submit.reset {
			width: 150px;
			margin: 30px auto 0;
		}

		/* 完了画面 */
		.pw-reset .form-img img {
			max-width: 268px;
		}
}

@media only screen and (min-width: 970px){
		.pw-reset .container-frame .main-contents {
			padding-bottom: 16em;
		}
		.pw-reset .white-frame .title {
			width: 360px;
			margin: 30px auto 5px;
			text-align:left;
		}
		.pw-reset .white-frame .error {
			width:auto;
			margin:5px 0 0 50px;
			text-align:left;
		}
		.pw-reset .white-frame input[type="text"],
		.pw-reset .white-frame input[type="password"] {
			margin:0 8.3%;
		}
		/* 完了画面 */
		.pw-reset .form-img {
			margin-top: 60px;
		}
}


/* -------------------------------------------------------------------
 missword
---------------------------------------------------------------------*/
.missword .contents-inner{
	border-top:1px solid #ccc;
	padding:1em 0;
	margin:1em 0;
}

/* -------------------
	missword-area
 -------------------*/
.missword .missword-area{
	width:100%;
	margin:5% 0 100px 0;
}

.missword .white-frame{
	max-width:800px;
	margin:0 auto;
	text-align:center;
}

.missword h2{
	font-size:18px;
	text-align:center;
	font-weight:bold;
}

.missword .white-frame img{
	padding:2em 0;
	max-width:150px;
}

.missword .white-frame p{
	padding-bottom:1em;
}

.missword .white-frame .text01 .a{
	color:#90c31f;
	font-weight:bold;
}

.missword .white-frame .text02{
	font-size:12px;
}

.missword .list-area{
	border:3px solid #dadada;
	border-radius:5px;
	padding:1em;
	margin:1em;
}

.missword .list-area h3{
	border-bottom:1px solid #dadada;
	padding-bottom:1em;
	margin:0 0 1em 0;
}

.missword .list-area li{
	float:left;
	padding: 0 0.5em;
	line-height:1.8;
}

@media only screen and (min-width: 670px){
		.missword .white-frame img{
			max-width:250px;
		}

		.missword .white-frame .text01 .a{
			display:block;
		}
}

/* -------------------------------------------------------------------
 co-op
---------------------------------------------------------------------*/
.co-op .main-contents {
	padding: 2em 0;
}
.co-op .main-contents h1 {
	padding: 0 0.7em 0.5em;
}
.co-op .html-tab-box {
	background-color: #FFF;
	margin: 0 auto;
	width: 100%;
	position: relative;
	font-size:15px;
}
.co-op .info {
	padding: 0 10px;
}
.co-op .info .box {
	margin-top: 30px;
}
.co-op .info .info-h img {
	width: 135px;
	padding-left: 10px;
}
.co-op .info .info-h-2 {
	font-size:12px;
	color:#dadada;
	font-weight:bold;
	margin-left:10px;
	font-style:italic;
	line-height:36px;
	vertical-align:top;
}
.co-op .info .more {
	margin-top:10px;
	text-align:right;
}
.co-op .info .contents {
	margin-top:10px;
}
.co-op .info .contents p {
	float:left;
	margin-top:10px;
	line-height:1.8;
	font-size: 14px;
	padding: 0 10px;
	box-sizing: border-box;
	width: 100%;
}
.co-op .info .contents p:first-child {
	text-align: center;
	padding: 0;
}
.co-op .info .contents img {
	margin: 0 auto;
}
.co-op .info .info-table {
	width:100%;
	border-left:1px solid #ccc;
	border-top:1px solid #ccc;
	margin-top:20px;
	font-size: 14px;
	border-collapse: collapse;
}
.co-op .info .info-table th,
.co-op .info .info-table td {
	text-align:center;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding:8px;
	width:50%;
}
.co-op .info .info-table .before {
	background-color:#4d4d4d;
	color:#fff;
	font-size:18px;
	font-weight: normal;
	border:1px solid #4d4d4d;
}
.co-op .info .corec .info-table .after {
	background-color:#90c31f;
	color:#fff;
	font-size:18px;
	border:1px solid #90c31f;
}
.co-op .info .square .info-table .after {
	background-color:#1492d6;
	color:#fff;
	font-size: 18px;
	border:1px solid #1492d6;
}
.co-op .info .info-table td div {
	position: relative;
}
.co-op .info .info-table td span {
	position: absolute;
	left: 0%;
	top: 0%;
	margin-left: -20px;
	width: 20px;
}
.co-op .info .info-table .b {
	background-color:#f3f2ef;
}
.co-op .option a:hover {
	opacity:0.8;
}
.co-op .step {
	margin: 40px 10px 0;
	padding: 0 10px;
}
.co-op .step .step-h {
	font-size: 20px;
	font-weight: normal;
}
.co-op .step li {
	margin-top: 110px;
}
.co-op .step li:first-child {
	margin-top: 20px;
}
.co-op .step .step-no {
	font-size: 20px;
	font-style: italic;
	padding-bottom: 0;
	line-height: 1;
}
.co-op .step li .co-btn-m {
	width: 230px;
}
.co-op .step .last {
	background:none;
}
.co-op .step .step-no-box {
	padding: 0;
}
.co-op .step .step-no span {
	font-size:24px;
}
.co-op .step .step-text {
	width: 100%;
}
.co-op .step .step-text p {
	margin-top: 5px;
	font-size: 14px;
}
.co-op .step .step-text p + p {
	font-size:15px;
}
.co-op .step .step-text-h {
	position: relative;
}
.co-op .step .step-text-h p {
	font-size: 18px;
	font-weight:bold;
	padding-top:0;
}
.co-op .step .step-text p a {
	display: block;
	font-size: 15px;
}
.co-op .step-finish {
	text-align: center;
	margin-top: 20px;
}
.co-op .step-finish img {
	width: 50px;
}
.co-op .step-finish p {
	color: #87be0d;
	font-size: 14px;
	margin-top: 8px;
}
.co-op .step-finish p span {
	display: block;
}
.co-op .button-block {
	width: 260px;
	margin: 0 auto;
	line-height: 2.6;
	padding: 35px 0 40px;
}
.co-op .button-footer-block {
	width: 230px;
	margin: 0 auto;
	line-height: 2.6;
	padding: 35px 0 40px;
}

@media only screen and (min-width: 670px){
		.html-tab-box {
			border: solid 1px #cccccc;
		}
		.co-op .info {
			padding: 0;
			width: 85%;
			margin: 0 auto;
		}
		.co-op .info .box {
			margin-top: 40px;
		}
		.co-op .info .info-h img {
			padding-left: 0;
		}
		.co-op .info .corec .info-h img {
			width: 190px;
			padding-left: 0;
		}
		.co-op .info .info-h-2 {
			font-size: 16px;
			color:#dadada;
			font-weight:bold;
			margin-left:30px;
			font-style:italic;
			line-height:36px;
			vertical-align:top;
		}
		.co-op .info .contents p {
			float: left;
			margin-top: 10px;
			width: 50%;
			line-height: 1.8;
			font-size: 15px;
			box-sizing: border-box;
			padding: 0 15px 0 0;
		}
		.co-op .info .contents p:first-child {
			float: right;
			text-align: right;
			padding-right: 0;
		}
		.co-op .info .contents img {
			margin: 0 auto;
		}
		.co-op .info .info-table .before {
			font-size: 18px;
			font-weight: normal;
		}
		.co-op .info .corec .info-table .after {
			font-size: 18px;
			font-weight: normal;
		}
		.co-op .info .square .info-table .after {
			font-size:18px;
			font-weight: normal;
		}
		.co-op .info .info-table th,
		.co-op .info .info-table td {
			font-size: 15px;
		}
		.co-op .step {
			width: 85%;
			margin: 30px auto 0;
		}
		.co-op .step .step-h {
			font-size: 30px;
		}
		.co-op .step li {
			margin-top: 40px;
		}
		.co-op .step .step-no {
			float: left;
			width: 20%;
			min-height: 120px;
			padding: 0 0 10px 10px;
			background: url("/img/contents-simple/img_arrow02.png") center 60px no-repeat;
			box-sizing: border-box;
			font-size: 24px;
		}
		.co-op .step .step-no span {
			font-size: 28px;
		}
		.co-op .step .step-text {
			border-left: 1px solid #90c31f;
			float: right;
			width: 80%;
			padding: 0 20px;
			box-sizing: border-box;
		}
		.co-op .step .step-text p {
			font-size: 15px;
			margin-top: 20px;
		}
		.co-op .step .step-text p a {
			display: inline;
			background-position: left 6px;
		}
		.co-op .step .step-text-h p {
			font-size: 20px;
			margin: 10px 30px 10px 0;
			float: left;
		}
		.co-op .step .step-no-box {
			padding: 0 20px;
		}
		.co-op .step .last {
			background: none;
			min-height: 0;
		}
		.co-op .step-finish p {
			font-size: 20px;
		}
		.co-op .step-finish p span:last-child {
			display: inline;
		}
		.co-op .step-finish img {
			width: 60px;
		}
}

@media only screen and (min-width: 970px){
		.co-op .main-contents {
			padding: 2em 1.3em 6em;
		}
		.co-op .main-contents h1 {
			padding: 0.5em 0;
		}
		.co-op .info .box {
			margin-top: 50px;
		}
		.co-op .step-finish p {
			font-size: 24px;
		}
}

/* -------------------
	square連携
 -------------------*/
.link-square .main-contents {
	padding: 4.2em 0 0;
}
.link-square .main-contents h1 {
	padding-bottom: 0;
	margin-bottom: 10px;
}
.square-box .html-tab-box {
	background-color: #FFF;
	margin: 0 auto;
	width: 100%;
	position: relative;
	font-size:15px;
}
.square-box .main-txt {
	text-align: center;
	padding: 30px 20px;
	color: #87be0d;
	font-size: 18px;
	font-weight: bold;
	border-top: solid 1px #dadada;
}
.square-box .main-txt span {
	display: block;
}
.square-box .main-visual {
	text-align: center;
	margin-top: 20px;
}
.square-box .logo-corec {
	position: absolute;
	top: -30px;
	left: 50%;
	margin-left: -48px;
	width: 96px;
}
.square-box .logo-square {
	position: absolute;
	bottom: -30px;
	left: 50%;
	margin-left: -42px;
	width: 84px;
}
.square-box .img-corec {
	background: #e0eec0;
	padding-bottom: 30px;
	position: relative;
}
.square-box .img-corec:before {
	width: 0;
	height:0;
	border: solid 28px transparent;
	border-top: solid 28px #ffffff;
	content:'';
	position: absolute;
	bottom: -29px;
	left: 50%;
	margin-left: -28px;
}
.square-box .img-corec:after {
	width: 0;
	height:0;
	border: solid 28px transparent;
	border-top: solid 28px #e0eec0;
	content:'';
	position: absolute;
	bottom: -27px;
	left: 50%;
	margin-left: -28px;
}
.square-box .img-corec > img {
	width: 85%;
	max-width: 400px;
}
.square-box .img-square {
	background:#5cb8e7;
	padding-top: 30px;
	position: relative;
}
.square-box .img-square:before {
	width: 0;
	height:0;
	border: solid 28px transparent;
	border-bottom: solid 28px #ffffff;
	content:'';
	position: absolute;
	top: -29px;
	left: 50%;
	margin-left: -28px;
}
.square-box .img-square:after {
	width: 0;
	height:0;
	border: solid 28px transparent;
	border-bottom: solid 28px #5cb8e7;
	content:'';
	position: absolute;
	top: -27px;
	left: 50%;
	margin-left: -28px;
}
.square-box .img-square > img {
	width: 85%;
	max-width: 400px;
}
.square-box .box02 {
	padding:30px 10px 40px;
	border-bottom:3px solid #e9e7e1;
}
.square-box .box02-h {
	text-align: left;
	font-size: 19px;
	padding-top: 30px;
}
.square-box .box02 ul li {
	float: left;
	width: 100%;
}
.square-box .box02 .img {
	float: left;
	height: 90px;
	width: 100px;
}
.square-box .box02 img {
	width: 90%;
}
.square-box .box02 .box {
	margin-top: 10px;
}
.square-box .box02 .box dt {
	font-size:18px;
	color:#90c31f;
	padding:0 0 4px;
}
.square-box .box02 .box dd {
	width:100%;
	font-size: 14px;
}
.square-box .step .step-text-h .co-btn {
	margin: 0;
	position: absolute;
	top: 9em;
	left: 50%;
	margin-left: -114px;
}
.square-box .step li:first-child .co-btn {
	top: 7.5em;
}

@media only screen and (min-width: 390px){
		.square-box .step .step-text-h .co-btn {
			top: 7.5em;
		}
		.square-box .step li:first-child .co-btn {
			top: 6em;
		}
}

@media only screen and (min-width: 560px){
		.square-box .step .step-text-h .co-btn {
			top: 6em;
		}
}

@media only screen and (min-width: 670px){
		.link-square .main-contents {
			padding: 2em 0;
		}
		.link-square .main-contents h1 {
			padding: 1.5em 0.7em 0.5em;
		}
		.html-tab-box.square-box {
			box-sizing: border-box;
		}
		.square-box .main-txt {
			font-size: 23px;
			padding: 40px 20px 50px;
			border-top: none;
		}
		.square-box .main-txt span {
			display: inline;
		}
		.square-box .main-txt span:nth-child(3) {
			display: block;
		}
		.square-box .main-visual {
			margin-bottom: 20px;
		}
		.square-box .logo-corec {
			top: -35px;
			margin-left: -66px;
			width: 132px;
		}
		.square-box .logo-square {
			top: -40px;
			margin-left: -58px;
			width: 116px;
		}
		.square-box .img-corec {
			padding: 10px 0 30px;
			float: left;
			width: 50%;
			box-sizing: border-box;
			max-height: none;
			vertical-align: bottom;
		}
		.square-box .img-corec:before {
			border: solid 28px transparent;
			border-left: solid 28px #ffffff;
			top: 50%;
			left: 100%;
			margin: -28px 0 0 -28px;
		}
		.square-box .img-corec:after {
			border: solid 28px transparent;
			border-left: solid 28px #e0eec0;
			top: 50%;
			left: 100%;
			margin: -28px 0 0 -30px;
		}
		.square-box .img-corec > img {
			width: 85%;
			max-width: 400px;
		}
		.square-box .img-square {
			padding-top: 40px;
			float: left;
			width: 50%;
			box-sizing: border-box;
			max-height: none;
		}
		.square-box .img-square:before {
			border: solid 28px transparent;
			border-right: solid 28px #ffffff;
			top: 50%;
			left: 0%;
			margin: -28px 0 0 -30px;
		}
		.square-box .img-square:after {
			border: solid 28px transparent;
			border-right: solid 28px #5cb8e7;
			top: 50%;
			left: 0%;
			margin: -28px 0 0 -28px;
		}
		.square-box .img-square > img {
			width: 85%;
			max-width: 400px;
		}
		.square-box .box02 {
			padding: 20px 10px 40px;
			border-bottom:3px solid #e9e7e1;
		}
		.square-box .box02-h {
			text-align: center;
			font-size: 30px;
			padding-top: 0;
		}
		.square-box .box02-h span {
			display: inline-block;
		}
		.square-box .box02 ul li {
			float: left;
			width: 50%;
			padding: 10px 50px;
			box-sizing: border-box;
		}
		.square-box .box02 img {
			width: 100%;
		}
		.square-box .box02 .box dt {
			font-size: 22px;
		}
		.square-box .box02 .img {
			float: left;
			height: 108px;
			width: 108px;
			margin-right: 10px;
		}
		.square-box .box02 .box dd {
			width:100%;
			font-size: 15px;
		}
		.square-box .step .step-text-h .co-btn {
			margin: 0;
			position: static;
			float: left;
		}
		.square-box .step-finish p span:last-child {
			display: inline;
		}
}

@media only screen and (min-width: 970px){
		.link-square .main-contents	 {
			padding: 2em 1.3em 6em;
		}
		.link-square .main-contents h1 {
			padding: 2em 0 1em;
		}
		.square-box .img-corec img {
			width: 100%;
		}
		.square-box .img-square img {
			width: 100%;
		}
}

@media only screen and (min-width: 1210px){
		.square-box .main-txt span {
			display: inline-block;
		}
}

/* -------------------
	外部連携一覧
 -------------------*/
.coop-list .main-contents {
	padding-bottom: 3.5em;
}
.coop-list .coop-box {
	width: 100%;
	max-width: 930px;
	margin: 0 auto;
}
.coop-list .coop-box a {
	text-decoration: none;
}
.coop-list .coop-box div {
	width: 100%;
	border:solid 1px #dadada;
	background: #ffffff;
	border-radius: 5px;
	height: auto;
	padding: 25px;
	box-sizing: border-box;
}
.coop-list .coop-box a:hover div {
	background: #f8f8f8;
}
.coop-list .coop-box .left img {
	width: 180px;
}
.coop-list .coop-box .right {
	margin-top: 25px;
}
.coop-list .coop-box .right img {
	width: 116px;
}
.coop-list .coop-box div .desc {
	margin-top: 20px;
	color: #4d4d4d;
}
.coop-list .coop-box div .link {
	margin-top: 20px;
	background: url(/img/common/icon/icon_txt_link.png) no-repeat 1px 5px;
	padding-left: 0.75em;
}

@media only screen and (min-width: 670px){
		.coop-list .main-contents {
			padding-bottom: 15em;
		}
		.coop-list .coop-box div {
			max-width: 368px;
			width: 40%;
			padding: 30px;
			box-sizing: content-box;
		}
		.coop-list .coop-box .left {
			float: left;
		}
		.coop-list .coop-box .left img {
			width: 218px;
		}
		.coop-list .coop-box .right {
			float: right;
			margin-top: 0;
		}
		.coop-list .coop-box .right img {
			width: 130px;
		}
		.coop-list .coop-box div .desc {
			margin-top: 20px;
			height: 6em;
		}
		.coop-list .coop-box div .link {
			margin-top: 0;
		}
}
@media only screen and (min-width: 970px){
		.coop-list .main-contents {
			padding-bottom: 25em;
		}
}
/* -------------------------------------------------------------------
 メンテナンス用ページ
---------------------------------------------------------------------*/
.maintenance {
	margin: auto;
	padding: 8% 1em 0;
	width: 290px;
	font-size:11px;
	text-align:center;
}

.maintenance .logo{
	max-width:80px;
}

.maintenance h1{
	font-size: 20px;
	font-weight: bold;
	color: #666;
	padding:1em 0 0;
}

.maintenance p{
	padding: 1em 0 0;
	text-align: left;
}

.maintenance table{
	border-top: 1px solid #dadada;
	border-left: 1px solid #dadada;
	text-align: left;
	margin: 2em auto 0;
}

.maintenance table th,
.maintenance table td{
	padding: 0.3em;
	border-right: 1px solid #dadada;
	border-bottom: 1px solid #dadada;
	background-color:#fff;
}

.maintenance table th{
	background-color: #e5e5e5;
	white-space:nowrap;
	vertical-align:middle;
}

.maintenance footer {
	color:#999;
	padding:5em 0;
	font-size:11px;
	background-color:#f3f2ef;
	text-align:center;
}


@media only screen and (min-width: 670px){
		.maintenance {
			font-size:14px;
		}

		.maintenance .logo{
			max-width:120px;
		}

		.maintenance h1{
			font-size: 26px;
		}

		.maintenance p{
			text-align: center;
		}

		.maintenance {
			width: auto;
		}

		.maintenance table th,
		.maintenance table td{
			padding: 0.7em;
		}
}

/********* 会員登録	 *********/
.register .main-contents {
	background:#e9e7e1 url("/img/prelogin/bg_club_buy.png") 0 -20% repeat;
}


/********* 利用事例	 *********/
  /* PC */
  @media screen and (min-width: 961px) {
		/* ここにPCの記述*/
		.case .container-frame {
		  background-color: #ffffff;
		}
		.case .main-contents {
		  background-color: #ffffff;
		  margin: 0 auto;
		  padding: 5.5em 0 0 !important;
		  width: 940px;
		}
		.case .first-catch {
		  font-size: 30px;
		  margin: 0 0 20px;
		  text-align: center;
		}
		.case .mv-box {
		  margin: 0 auto;
		}
		.case .mv-box .mv {
		  float: left;
		  width: 545px;
		}
		.case .mv-box .txt {
		  float: right;
		  background-color: #e9e7e1;
		  height: 185px;
		  padding: 50px 0 45px;
		  position: relative;
		  text-align: center;
		  width: 395px;
		}
		.case .mv-box .genre {
		  font-size: 12px;
		  font-size: 0.85rem;
		  position: absolute;
		  right: 10px;
		  top: 17px;
		}
		.case .mv-box .genre .category {
		  background-color: #ffffff;
		  min-width: 1.5em;
		  padding: 6px 16px;
		}
		.case .mv-box .genre .sup {
		  background-color: #85c9ed;
		  color: #ffffff;
		  padding: 6px;
		}
		.case .mv-box .genre .buy {
		  background-color: #e6a32f;
		  color: #ffffff;
		  padding: 6px;
		}
		.case .mv-box .logo {
		  font-size: 17px;
		  font-size: 1.21rem;
		  font-weight: bold;
		  margin: 15px auto 0;
		  width: 145px;
		}
		.case .mv-box .logo img {
		  height: 45px;
		}
	  .case .mv-box .logo.yamatomi img,
    .case .mv-box .logo.t3tec img  {
	    height: auto;
	  }
		.case .mv-box .catch-txt {
		  font-size: 19px;
		  font-size: 1.36rem;
		  font-weight: bold;
		  margin-top: 15px;
		}
		.case .mv-box .catch-txt .first,
		.case .mv-box .catch-txt .last {
		  position: relative;
		}
		.case .mv-box .catch-txt .first:before {
		  background: url(/img/prelogin/img_case_serif_before.png) no-repeat;
		  content: "";
		  height: 20px;
		  left: -1.2em;
		  position: absolute;
		  width: 20px;
		}
		.case .mv-box .catch-txt .last:after {
		  background: url(/img/prelogin/img_case_serif_after.png) no-repeat;
		  background-position: 10%;
		  content: "";
		  height: 20px;
		  right: -1em;
		  position: absolute;
		  width: 20px;
		}
		.case .mv-box .client-info {
		  font-size: 15px;
		  font-size: 1.07rem;
		  line-height: 1.25;
		  margin-top: 15px;
		}
		.case .mv-box .client-info span {
		  font-size: 13px;
		  font-size: 0.93rem;
		}
  }

  /* TABLET */
  @media screen and (max-width: 960px) and (min-width: 671px) {
		/* ここにTABLETの記述 */
		.case .container-frame {
		  background-color: #ffffff;
		}
		.case .main-contents {
		  background-color: #ffffff;
		  margin: 0 auto;
		  padding: 5.5em 0 0 !important;
		  width: 96%;
		}
		.case .first-catch {
		  font-size: 30px;
		  margin: 0 0 20px;
		  text-align: center;
		}
		.case .mv-box {
		  display: table;
		  margin: 0 auto;
		  width: 100%;
		}
		.case .mv-box:after {
		  clear: none;
		  display:none;
		}
		.case .mv-box .mv {
		  display: table-cell;
		  width: 60%;
		}
		.case .mv-box .txt {
		  display: table-cell;
		  background-color: #e9e7e1;
		  position: relative;
		  text-align: center;
		  vertical-align: middle;
		  width: 40%;
		}
		.case .mv-box .genre {
		  font-size: 12px;
		  font-size: 0.85rem;
		  position: absolute;
		  right: 10px;
		  top: 17px;
		}
		.case .mv-box .genre .category {
		  background-color: #ffffff;
		  padding: 3px 12px;
		}
		.case .mv-box .genre .sup {
		  background-color: #85c9ed;
		  color: #ffffff;
		  padding: 3px 12px;
		}
		.case .mv-box .genre .buy {
		  background-color: #e6a32f;
		  color: #ffffff;
		  padding: 3px 12px;
		}
		.case .mv-box .logo {
		  margin: 25px auto 0;
		}
		.case .mv-box .logo img {
		  height: 40px;
		}
    .case .mv-box .logo.yamatomi img,
    .case .mv-box .logo.t3tec img {
      height: 25px;
    }
		.case .mv-box .catch-txt {
		  font-size: 15px;
		  font-size: 1.07rem;
		  font-weight: bold;
		  margin-top: 10px;
		}
		.case .mv-box .catch-txt .first,
		.case .mv-box .catch-txt .last {
		  position: relative;
		}
		.case .mv-box .catch-txt .first:before {
		  background: url(/img/prelogin/img_case_serif_before.png) no-repeat;
		  background-size: 15px 15px;
		  content: "";
		  height: 20px;
		  left: -1.2em;
		  position: absolute;
		  width: 20px;
		}
		.case .mv-box .catch-txt .last:after {
		  background: url(/img/prelogin/img_case_serif_after.png) no-repeat;
		  background-position: 10%;
		  background-size: 15px 15px;
		  content: "";
		  height: 20px;
		  right: -1em;
		  position: absolute;
		  width: 20px;
		}
		.case .mv-box .client-info {
		  font-size: 13px;
		  font-size: 0.93rem;
		  line-height: 1.25;
		  margin-top: 10px;
		}
		.case .mv-box .client-info span {
		  font-size: 11px;
		  font-size: 0.79rem;
		}
  }

  /* SP */
  @media screen and (max-width: 670px) {
	/* ここにモバイルの記述 */
	.case .container-frame {
	  background-color: #ffffff;
	}
	.case .main-contents {
	  background-color: #ffffff;
	  margin: 0 auto;
	  padding: 4em 0 0 !important;
	  width: 100%;
	}
	.case h1 {
	  font-size: 17px;
	  font-size: 1.21rem;
	  margin-top: 20px;
	  text-align: center;
	}
	.case .first-catch span {
	  display: block;
	}
	.case .mv-box {
	  margin: 0 auto;
	}
	.case .mv-box .mv {
	  width: 100%;
	}
	.case .mv-box .mv img {
	  width: 100%;
	  max-width: 100%;
	}
	.case .mv-box .txt {
	  background-color: #e9e7e1;
	  padding: 50px 0 30px;
	  position: relative;
	  text-align: center;
	  width: 100%;
	}
	.case .mv-box .genre {
	  font-size: 12px;
	  font-size: 0.85rem;
	  position: absolute;
	  right: 10px;
	  top: 13px;
	}
	.case .mv-box .genre .category {
	  background-color: #ffffff;
	  padding: 3px 12px;
	}
	.case .mv-box .genre .sup {
	  background-color: #85c9ed;
	  color: #ffffff;
	  padding: 3px 12px;
	}
	.case .mv-box .genre .buy {
	  background-color: #e6a32f;
	  color: #ffffff;
	  padding: 3px 12px;
	}
	.case .mv-box .logo {
	  margin: 0 auto;
	  width: 140px;
	}
	.case .mv-box .logo img {
	  height: 40px;
	}
  .case .mv-box .logo.yamatomi img,
  .case .mv-box .logo.t3tec img {
    height: auto;
    
  }
	.case .mv-box .catch-txt {
	  font-size: 17px;
	  font-size: 1.21rem;
	  font-weight: bold;
	  margin-top: 10px;
	}
	.case .mv-box .catch-txt .first,
	.case .mv-box .catch-txt .last {
	  position: relative;
	}
	.case .mv-box .catch-txt .first:before {
	  background: url(/img/prelogin/img_case_serif_before_sp.png) no-repeat;
	  background-size: 20px 20px;
	  content: "";
	  height: 20px;
	  left: -1.2em;
	  position: absolute;
	  width: 20px;
	}
	.case .mv-box .catch-txt .last:after {
	  background: url(/img/prelogin/img_case_serif_after_sp.png) no-repeat;
	  background-size: 20px 20px;
	  background-position: 10%;
	  content: "";
	  height: 20px;
	  right: -1.2em;
	  position: absolute;
	  width: 20px;
	}
	.case .mv-box .client-info {
	  font-size: 13px;
	  font-size: 0.93rem;
	  line-height: 1.25;
	  margin-top: 10px;
	}
	.case .mv-box .client-info span {
	  font-size: 11px;
	  font-size: 0.79rem;
	}
  }



  @media screen and (min-width: 961px) {
	/* ここにPCの記述*/
	.case .compare-box {
	  margin: 30px auto;
	  position: relative;
	  display: table;
	}
	.case .compare-box .title {
	  display: table-cell;
	  font-size: 17px;
	  font-size: 1.21rem;
	  font-weight: bold;
	  left: 50%;
	  margin-left: -19%;
	  position: absolute;
	  text-align: center;
	  top: 15px;
	}
	.case .compare-box .before-box {
	  background-color: #fffcf0;
	  border: solid 1px #f2ebd1;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  display: table-cell;
	  padding: 10px 20px;
	  position: relative;
	  vertical-align: middle;
	  width: 47%;
	}
	.case .compare-box .after-box {
	  background-color: #fffcf0;
	  border: solid 1px #f2ebd1;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  display: table-cell;
	  margin-left: 30px;
	  padding: 45px 20px;
	  position: relative;
	  width: 47%;
	  vertical-align: middle;
	}
	.compare-box .after-box li .marker {
	  background : -webkit-gradient(linear, left top, left bottom, from(transparent 60%), to(#fff000 60%));
	  background : -webkit-linear-gradient(top, transparent 60%, #fff000 60%);
	  background : linear-gradient(to bottom, transparent 60%, #fff000 60%);
	}
	.case .compare-box	li {
	  background: url("/img/prelogin/img_case_note_bg.png");
	  font-size: 13px;
	  font-size: 0.93rem;
	  line-height: 30px;
	  padding-left: 1em;
	  text-indent: -1em;
	}
	.case .compare-box .arrow {
	  left: 50%;
	  margin: -45px 0 0 -45px;
	  position: absolute;
	  top: 50%;
	  z-index: 5;
	}
	.case .compare-box .arrow-sp {
	  display: none;
	}
  }

  /* TABLET */
  @media screen and (max-width: 960px) and (min-width: 671px) {
	/* ここにTABLETの記述 */
	.case .compare-box {
	  margin: 30px auto;
	  position: relative;
	  display: table;
	}
	.case .compare-box .title {
	  display: table-cell;
	  font-size: 17px;
	  font-size: 1.21rem;
	  font-weight: bold;
	  left: 50%;
	  margin-left: -21%;
	  position: absolute;
	  text-align: center;
	  top: 15px;
	}
	.case .compare-box .before-box {
	  background-color: #fffcf0;
	  border: solid 1px #f2ebd1;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  display: table-cell;
	  padding: 10px 20px;
	  position: relative;
	  vertical-align: middle;
	  width: 47%;
	}
	.case .compare-box .after-box {
	  background-color: #fffcf0;
	  border: solid 1px #f2ebd1;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  display: table-cell;
	  margin-left: 30px;
	  padding: 45px 20px;
	  position: relative;
	  width: 47%;
	  vertical-align: middle;
	}
	.case .compare-box .after-box li .marker {
	  background : -webkit-gradient(linear, left top, left bottom, from(transparent 60%), to(#fff000 60%));
	  background : -webkit-linear-gradient(top, transparent 60%, #fff000 60%);
	  background : linear-gradient(to bottom, transparent 60%, #fff000 60%);
	}
	.case .compare-box	li {
	  background: url("/img/prelogin/img_case_note_bg.png");
	  font-size: 13px;
	  font-size: 0.93rem;
	  line-height: 30px;
	  padding-left: 1em;
	  text-indent: -1em;
	}
	.case .compare-box .arrow {
	  display: table-cell;
	  vertical-align: middle;
	}
	.case .compare-box .arrow img {
	  margin: 0 -4px;
	  max-width: none;
	  position: relative;
	  width: 58px;
	  z-index: 5;
	}
	.case .compare-box .arrow-sp {
	  display: none;
	}

  }

  /* SP */
  @media screen and (max-width: 670px) {
	/* ここにモバイルの記述 */
	.case .compare-box {
	  margin: 10px auto;
	  position: relative;
	}
	.case .compare-box .before-box {
	  background-color: #fffcf0;
	  border: solid 1px #f2ebd1;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  margin: 0 auto;
	  padding: 20px;
	  width: 94%;
	}
	.case .compare-box .after-box {
	  background-color: #fffcf0;
	  border: solid 1px #f2ebd1;
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  margin: 0 auto;
	  padding: 20px;
	  width: 94%;
	}
	.case .compare-box ul {
	  margin-top: 10px;
	}
	.case .compare-box .after-box li .marker {
	  background : -webkit-gradient(linear, left top, left bottom, from(transparent 60%), to(#fff000 60%));
	  background : -webkit-linear-gradient(top, transparent 60%, #fff000 60%);
	  background : linear-gradient(to bottom, transparent 60%, #fff000 60%);
	}
	.case .compare-box	li {
	  background: url("/img/prelogin/img_case_note_bg.png");
	  font-size: 13px;
	  font-size: 0.93rem;
	  line-height: 30px;
	  padding-left: 1em;
	  text-indent: -1em;
	}
	.case .compare-box .arrow {
	  display: none;
	}
	.case .compare-box .arrow-sp {
	  margin: -15px auto;
	  text-align: center;
	  width: 70px;
	}
	.case .compare-box .title {
	  font-size: 17px;
	  font-size: 1.21rem;
	  font-weight: bold;
	  text-align: center;
	}
  }

  @media screen and (min-width: 961px) {
	/* ここにPCの記述*/
	.case .sub-box {
	  margin-top: 40px;
	}
	.case .sub-box img {
	  border-radius: 10px;
	}
	.case .sub-box .left-txt {
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  float: left;
	  padding-right: 36px;
	  width: 540px;
	}
	.case .sub-box .left-txt .question,
	.case .sub-box .right-txt .question {
	  color: #90c31f;
	  font-size: 17px;
	  font-size: 1.21rem;
	  font-weight: bold;
	}
	.case .sub-box .left-txt .answer,
	.case .sub-box .right-txt .answer {
	  font-size: 15px;
	  font-size: 1.07rem;
	  margin-top: 20px;
	}
	.case .sub-box .right-photo {
	  float: right;
	  width: 400px;
	}
	.case .sub-box .right-txt {
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  float: right;
	  padding-left: 30px;
	  width: 540px;
	}
	.case .sub-box .left-photo {
	  float: left;
	  width: 400px;
	}
	.case .buyer-link {
	  border-top: dashed 1px #cccccc;
	  box-sizing: border-box;
	  margin: 20px auto 50px;
	  max-width: 1070px;
	  padding: 15px 20px 0 0;
	  text-align: right;
	  width: 100%;
	}
  }

  /* TABLET */
  @media screen and (max-width: 960px) and (min-width: 671px) {
	/* ここにTABLETの記述 */
	.case .sub-box {
	  margin-top: 70px;
	}
	.case .sub-box:nth-of-type(3) {
	  margin-top: 40px;
	}
	.case .sub-box img {
	  border-radius: 10px;
	}
	.case .sub-box .left-txt {
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  margin: 0 auto;
	  width: 90%;
	}
	.case .sub-box .left-txt .question,
	.case .sub-box .right-txt .question {
	  color: #90c31f;
	  font-size: 19px;
	  font-size: 1.46rem;
	  font-weight: bold;
	  margin: 0 auto 20px;
	  text-align: left;
	}
	.case .sub-box .left-txt .answer,
	.case .sub-box .right-txt .answer {
	  font-size: 15px;
	  font-size: 1.07rem;
	  margin: 0 auto;
	  text-align: left;
	}
	.case .sub-box .left-txt .answer:last-child {
	  margin: 20px auto;
	}
	.case .sub-box .right-photo {
	  margin: 20px auto 0;
	  text-align: center;
	  width: 90%;
	}
	.case .sub-box .right-txt {
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  margin: 0 auto;
	  width: 90%;
	}
	.case .sub-box .left-photo {
	  margin: 20px auto 0;
	  text-align: center;
	  width: 90%;
	}
	.case .buyer-link {
	  border-top: dashed 1px #cccccc;
	  box-sizing: border-box;
	  font-size: 13px;
	  font-size: 0.93rem;
	  margin: 20px auto 40px;
	  padding: 15px 20px 0 0;
	  text-align: right;
	  width: 100%;
	}
  }

  /* SP */
  @media screen and (max-width: 670px) {
	/* ここにモバイルの記述 */
	.case .sub-box {
	  margin-top: 35px;
	}
	.case .sub-box:nth-of-type(3) {
	  margin-top: 25px;
	}
	.case .sub-box img {
	  border-radius: 10px;
	}
	.case .sub-box .left-txt {
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  margin: 0 auto;
	  width: 90%;
	}
	.case .sub-box .left-txt .question,
	.case .sub-box .right-txt .question {
	  color: #90c31f;
	  font-size: 15px;
	  font-size: 1.07rem;
	  font-weight: bold;
	  margin: 0 auto 10px;
	  text-align: left;
	}
	.case .sub-box .left-txt .answer,
	.case .sub-box .right-txt .answer {
	  font-size: 13px;
	  font-size: 0.93rem;
	  margin: 0 auto;
	  text-align: left;
	}
	.case .sub-box .left-txt .answer.last,
	.case .sub-box .right-txt .answer.last {
	  margin-top: 20px;
	}
	.case .sub-box .right-photo,
	.case .sub-box .left-photo {
	  margin: 10px auto 0;
	  text-align: center;
	  width: 90%;
	}
	.case .sub-box .right-txt {
	  -webkit-box-sizing: border-box;
	  box-sizing: border-box;
	  margin: 0 auto;
	  width: 90%;
	}
	.case .buyer-link {
	  border-top: dashed 1px #cccccc;
	  box-sizing: border-box;
	  font-size: 13px;
	  font-size: 0.93rem;
	  margin: 22px auto;
	  padding: 10px 20px 0 0;
	  text-align: right;
	  width: 100%;
	}
  }

/* 会員登録 */
	.case .signup {
		background:#e9e7e1 url("/img/prelogin/bg_club_buy.png") 0 -20% repeat;
	}

  /* PC */
  @media screen and (min-width: 961px) {
	/* ここにPCの記述*/
	.case .signup .catch {
		font-size: 21px;
		font-size: 1.5rem;
	}
	.case .signup .catch span:first-child {
		font-weight: bold;
	}
}

  /* TABLET */
  @media screen and (max-width: 960px) and (min-width: 671px) {
	/* ここにTABLETの記述 */
	.case .signup .catch {
		font-size: 21px;
		font-size: 1.5rem;
		line-height: 1.3;
		margin-bottom: 30px;
	}
	.case .signup .catch span:first-child {
		font-weight: bold;
	}
	.case .signup .catch span:last-child {
		display: block;
	}
}

  /* SP */
  @media screen and (max-width: 670px) {
	/* ここにモバイルの記述 */
	.case .signup {
		padding: 2.5em 0 4em;
	}
	.case .signup .contents-wrap {
		width: 250px;
		margin: 0 auto;
	}
	.case .signup .catch {
		font-size: 17px;
		font-size: 1.3rem;
		line-height: 1.3;
	}
	.case .signup .catch span:first-child {
		font-weight: bold;
	}
	.case .signup .catch span:last-child {
		display: block;
	}
}

/* -------------------
	api-information
 -------------------*/
.api-information .infomation-box {
	max-width:700px;
	margin:0 auto;
	background-color:#ffffff;
}
.api-information .infomation-box .infomation-area {
	padding:30px;
	font-size:15px;
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-top: 1px solid #cccccc;
}
.api-information .infomation-box .infomation-area .ttl {
	color:#87be0d;
	font-size: 28px;
	font-weight:normal;
	text-align:center;
	margin-bottom:25px;
}
.api-information .infomation-box .infomation-area dl {
	margin-bottom:10px;
}
.api-information .infomation-box .infomation-area dl dt {
	font-weight:bold;
	font-size:17px;
	margin-bottom:5px;
}
.api-information .infomation-box .infomation-area dl dd {
	font-size:15px;
	margin-left:8px;
}
.api-information .infomation-box .form-area {
	padding:5px 10px 10px 10px;
	border-left: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
}


/* -----------------------------------
	スマートシフトbyCOREC
 ----------------------------------*/
.pr-smartshift .main-contents h1 {
	text-align:center;
	padding: 2.5em 0 0;
	margin:0 0 0.5em;
}
.pr-smartshift .txt {
	cursor: pointer;
}
.pr-smartshift .main-contents > span {
	text-align:center;
	display: block;
	margin:0 0 1em;
}
.smartshift-box {
	text-align:center;
	color:#555;
	position: relative;
}
.smartshift-box .line {
	width:14px;
	height:101%;
	background-color: #90c31f;
	position:absolute;
	left:0;
	right:0;
	margin:0 auto;
	z-index:0;
}
.smartshift-box .main-visual {
	background:#90c31f url("/img/contents-simple/smartshift/bg_main.png") 50% bottom no-repeat;
	min-height:630px;
	color:#fff;
	z-index:1;
	position:relative;
	max-width:100%;	
}
.smartshift-box .main-visual .sub-title {
	font-size:18px;
	font-weight:bold;
	padding:70px 0 25px;
}
.smartshift-box .main-visual .sub-text {
	font-size:18px;
	font-weight:bold;
	padding:50px 0 0;
	line-height:1.8;
}
.smartshift-box .main-visual .sub-text span {
	display: block;
}
.smartshift-box .main-visual .sub-text .mobile {
	display: inline;
}
.smartshift-box .main-visual .op {
	font-weight:bold;
	padding:50px 0 25px;
	line-height:2;
}
.smartshift-box .q-con {
	background-color:#ebebeb;
	border:1px solid #ccc;
	max-width:100%;
	margin:50px 0 0 0;	
	position: relative;
}
.smartshift-box .q-con h3 {
	font-size:20px;
	font-weight:bold;
	position:absolute;
	left: 0;
	right: 0;
	margin:70px auto 0;
}
.smartshift-box .q-con h3 span {
	background-color:#fff;
	padding:8px 16px;
}
.smartshift-box .answer {
	font-size:0; /*inline-blockの隙間をなくす*/
}
.smartshift-box .answer li {
	display: inline-block;
}
.smartshift-box .answer .bad {
	width:50%;
	padding:90px 0 20px;
	color:#666;
	font-size:26px;
	position: relative;
}
.smartshift-box .con-1 .answer .bad {
	padding:140px 0 20px;
}
.smartshift-box .answer .good {
	width:50%;
	background-color:#fff;
	padding:140px 0 20px;
	color:#90c31f;
	font-size:26px;
}
.smartshift-box .answer .good .op {
	font-size:16px;
}
.smartshift-box .answer p {
	font-weight:bold;
	padding:0;
	margin:0;
	line-height:1.2;
}
.smartshift-box .con-1 .answer .bad p ,
.smartshift-box .con-4 .answer .bad p {
	position:absolute;
	top:0;
	left:0;
	right:0;
	margin:0 auto;
}
.smartshift-box .con-4 .answer .bad p {
	font-size:56px;
}
.smartshift-box .answer .ratio {
	font-size:76px;
	display: block;
}
.smartshift-box .answer .ratio span {
	font-size:24px;
}
.smartshift-box .conclusion {
	background-color:#555;
	font-size:30px;
	color:#fff;
	padding:32px 0 30px;
	font-weight:bold;
}
.pr-smartshift .after {
	margin-top:70px;
	text-align: center;
}
.pr-smartshift .after p {
	margin-top:20px;
	font-size:20px;
	font-weight:bold;
	color:#90c31f;
}
.pr-smartshift .link-service {
	margin:140px 0 60px;	
	text-align: center;
}
.pr-smartshift .link-service a {
	outline: none;
}
.pr-smartshift .link-service a:hover {
	opacity: 0.7;
}
.pr-smartshift .link-service img {
	display: inline-block;
	width:200px;
	padding-left:20px;
}
.pr-smartshift .link-service a:first-child {
	padding-left:0;
}

@media screen and (max-width: 670px) {
	.pr-smartshift .main-contents h1 {
		width:100%;
		max-width:320px;
		margin:0 auto 1em;
	}
	.smartshift-box {
		margin:0 10px;	
	}
	.smartshift-box .line {
		width:10px;
	}
	.smartshift-box .main-visual {
		background:#90c31f url("/img/contents-simple/smartshift/bg_main_mo.png") right bottom no-repeat;
		min-height:400px;
		max-width:100%;	
	}
	.smartshift-box .main-visual h2 {
		max-width:260px;
		width:100%;
		margin:0 auto;
	}
	.smartshift-box .main-visual .sub-title {
		font-size:15px;
		padding:40px 0 25px;
	}
	.smartshift-box .main-visual .sub-text {
		font-size:14px;
		line-height:1.6;
		padding:30px 0 0;
	}
	.smartshift-box .main-visual .sub-text .mobile {
		display: block;
	}
	.smartshift-box .main-visual .op {
		padding:20px 20px 5px;
		line-height:1.6;
		font-size:10px;
	}
	.smartshift-box .q-con {
		margin:30px 0 0 0;
	}
	.smartshift-box .q-con h3 {
		font-size:13px;
		margin:30px auto 0;
	}
	.smartshift-box .q-con h3 span {
		padding:4px 10px;
	}
	.smartshift-box .answer img {
		width:100%;
		max-width:140px;
	}
	.smartshift-box .answer .bad {
		padding:45px 0 10px;
		font-size:13px;
	}
	.smartshift-box .con-1 .answer .bad {
		padding:70px 0 10px;
	}
	.smartshift-box .answer .good {
		padding:70px 0 10px;
		font-size:13px;
	}
	.smartshift-box .answer .good .op {
		font-size:8px;
	}
	.smartshift-box .answer p {
		line-height:1.2;
	}
	.smartshift-box .con-4 .answer .bad p {
		font-size:20px;
	}
	.smartshift-box .answer .ratio {
		font-size:38px;
	}
	.smartshift-box .answer .ratio span {
		font-size:12px;
	}
	.smartshift-box .conclusion {
		font-size:15px;
		padding:16px 0 15px;
	}
	.pr-smartshift .after {
		margin-top:35px;
	}
	.pr-smartshift .after img {
		width:100%;
		max-width:140px;
	}
	.pr-smartshift .after p {
		margin-top:10px;
		font-size:15px;
	}
	.pr-smartshift .after p span {
		display: block;
	}
	.pr-smartshift .link-service {
		margin:100px 10px 60px;
	}
	.pr-smartshift .link-service img {
		display: inline-block;
		width:46%;
		max-width:160px;
		padding-left:10px;
	}
}

/* -----------------------------------
	スマートシフトbyCOREC（モーダル）
 ----------------------------------*/
.pr-smartshift .modal-trigger-wrap {
	text-align:center;
	display: block;
	margin:0 0 1em;
}
.pr-smartshift label.txt {
	background: url("/img/prelogin/icon_txt_link.png") no-repeat scroll left 6px transparent;
	color: #3893EE;
	display: inline-block;
	line-height: 1.4;
	padding-bottom: 1px;
	padding-left: 12px;
	font-size:16px;
}
.pr-smartshift label.txt:hover {
	text-decoration: underline;
}
.pr-smartshift .modal .checkbox {
	display: none;
}
.pr-smartshift .modal .modal-overlay {
	opacity: 0;
	transition: all 0.3s ease;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -100;
	transform: scale(1);
	display: flex;
	background-color: rgba(0,0,0,0.7);
}
.pr-smartshift .modal input:checked ~ .modal-overlay {
	transform: scale(1);
	opacity:1;
	z-index: 9997;
	overflow: auto;
}
.pr-smartshift .modal .modal-wrap {
	background-color: #fff;
	box-shadow: 3px 3px 3px rgba(0,0,0,0.2);
	padding: 40px 50px;
	width: 60%;
	max-width:700px;
	margin: auto;
	align-self: flex-start;
	border-radius: 2px;
	transition: all 0.5s ease;
	position:relative;
}
.pr-smartshift .modal input:checked ~ .modal-overlay .modal-wrap {
	transform: translateY(0);
	z-index: 9999;
}
.pr-smartshift .modal .logo {
	padding-top:40px;
	text-align: center;
}
.pr-smartshift .modal .logo img {
	width:100%;
	max-width:360px;
}
.pr-smartshift .modal .text {
	text-align:left;
	padding-top:20px;
}
.pr-smartshift .modal .text p {
	line-height: 1.6;
	padding-top:20px;
}
.pr-smartshift .modal .modal-overlay .close {
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 20px;
	padding:0 8px;
	color: #fff !important;
	border-radius:2px;
	background-color:#666;
}
.pr-smartshift .modal .modal-overlay .close:hover {
	cursor: pointer;
}
.pr-smartshift .modal .o-close {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -100;
	color: #fff !important;
}
.pr-smartshift .modal input:checked ~ .o-close {
	z-index: 9998;
}

@media (max-width: 800px){
	.pr-smartshift .modal .modal-wrap {
		width: 80%;
		padding: 20px;
	}
}
@media screen and (max-width: 670px) {
	.pr-smartshift .wrap {
		width: 100%;
	}	
	.pr-smartshift .modal .modal-wrap {
		margin:auto 20px;
	}	
	.pr-smartshift .modal .logo img {
		max-width:260px;
	}
	.pr-smartshift .modal .text {
		padding-top:10px;
	}
	.pr-smartshift .modal .text p {
		padding-top:10px;
	}
}
