@charset "UTF-8";
@import "common.pc.css";

/* ---------------------------------------------------------
	CSS Document tab
--------------------------------------------------------- */
#tab { position: relative; margin-top: 20px;}
#tab::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: #003d66;}
#tab li { display: inline-block; margin: 0 25px; position: relative;}
#tab li.current { background: #f6fbff;}


/* ---------------------------------------------------------
	CSS Document visual
--------------------------------------------------------- */

#visual {
	height: 385px;
	background: #f5fbfe;
}

#visual .inner {
	height: 385px;
	background: url(../images/visual_02.jpg) no-repeat center top;
	position: relative;
}

#visual .container {
	padding-top: 80px;
	text-align: left;
	line-height: 35px;
	color: #3f7085;
}

#visual h1 {
	margin-bottom: 20px;
}

/* ---------------------------------------------------------
	CSS Document about
--------------------------------------------------------- */

#about {
	padding-bottom: 30px;
	background: #f5fbfe;
}

#about .container {
	width: 950px;
	padding: 19px;
	border: solid 1px #ccc;
	background: #fff url(../images/about_08.jpg) no-repeat right top;
	text-align: left;
}

#about #about_01 {
	margin-bottom: 10px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, Osaka, sans-serif;
	font-size: 22px;
	line-height: 50px;
}

#about h2 br {
	display: none;
}

#about #about_02 {
	margin: 30px 0;
	font-size: 11px;
	line-height: 11px;
}

#about #about_02 img {
	vertical-align: -1px;
}
#about #about_02 span {
    display: block;
    font-size: .9em;
    margin-top: 10px;
}

#about ul {
	width: 920px;
	margin-left: -6px;
	padding-bottom: 82px;
	background: url(../images/about_06.jpg) no-repeat center bottom;
}

#about #about_03 {
	margin: 30px 0 10px;
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, Osaka, sans-serif;
	font-size: 28px;
	line-height: 1;
	color: #3f7085;
}

#about #about_03 br {
	display: none;
}

/* ---------------------------------------------------------
	CSS Document seller
--------------------------------------------------------- */

#seller {
	padding: 30px 0 20px;
	background: #f3efec;
	line-height: 36px;
}

#seller h2 {
	margin-bottom: 40px;
}

#seller p {
	margin-bottom: 20px;
}

#seller #seller_01 {
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, Osaka, sans-serif;
	font-size: 30px;
	color: #3f7085;
}
#seller p.wrap {
	display: inline-block;
	padding: 4px 0 4px 60px;
	background: transparent url(../images/plus.jpg) 0 0 no-repeat;
	text-align: left;
	line-height: 1.5;
}

/* ---------------------------------------------------------
	CSS Document terms
--------------------------------------------------------- */

#terms {
	margin-bottom: 30px;
	padding: 0 0 50px;
	background: #f3efec;
	line-height: 40px;
}

#terms .container {
	width: 950px;
	padding: 30px 20px;
	border: solid 1px #ccc;
	background: #fff;
}

#terms h2 {
	margin-bottom: 10px;
	border-radius: 40px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	background: #666;
	font-weight: 100;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, Osaka, sans-serif;
	font-size: 26px;
	color: #fff;
}

#terms ol {
	margin-bottom: 20px;
	text-align: left;
	font-size: 16px;
}

#terms li span {
	display: inline-block;
	vertical-align: middle;
	width: 24px;
	height: 24px;
	margin-right: 10px;
	border-radius: 40px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border:solid 2px #c9151e;
	text-align: center;
	line-height: 24px;
}

#terms #terms_02 {
	text-align: left;
	font-size: 14px;
	line-height: 1.9;
}

#terms .btn {
	margin-top: 50px;
}

/* ---------------------------------------------------------
	CSS Document flow
--------------------------------------------------------- */

#flow h2 {
	margin-bottom: 30px;
}

#flow .section {
	padding-bottom: 10px;
	text-align: left;
	position: relative;
}

#flow .section:after {
	content: url(../images/flow_16.jpg);
	display: block;
	text-align: center;
	line-height: 0;
}

#flow .section:last-child:after {
	display: none;
}

#flow .section .clearfix {
	min-height: 160px;
}

#flow h3 {
	margin-bottom: 15px;
}

#flow p {
	width: 665px;
	margin-bottom: 15px;
	font-size: 17px;
	line-height: 1.8;
}

#flow p.image {
	width: 235px;
	position: absolute;
	top: 0;
	right: 0;
}

#flow strong {
	font-weight: normal;
	color: #d60c18;
}

#flow p span {
	display: inline-block;
	vertical-align: top;
	margin-right: 8px;
	font-size: 14px;
	line-height: 40px;
}

#flow p span:last-child {
	margin-right: 0;
}

#flow p span img {
	vertical-align: middle;
}

/* ---------------------------------------------------------
	CSS Document support
--------------------------------------------------------- */

#support .container {
	width: 950px;
	margin-bottom: 30px;
	padding: 29px 0;
	border: solid 1px #ccc;
	font-size: 17px;
	line-height: 30px;
	margin-top: 15px;
}


#support h2 {
	margin: 0 19px 22px;
	padding: 18px;
	border: solid 2px #d60c18;
}

#support p {
	margin-bottom: 22px;
}

#support p#support_01 {
	margin-bottom: 5px;
}

#support ol {
	margin-bottom: 15px;
}

#support li {
	display: inline-block;
	vertical-align: top;
}

#support p.btn {
	margin-bottom: 0;
}

#support p.btn2 {
	margin-bottom: 20px;
}


/* ---------------------------------------------------------
	CSS Document buyer
--------------------------------------------------------- */

#buyer {
	margin-top: 0px;
	padding: 42px 0 10px;
	background: #f3efec;
	line-height: 36px;
}

#buyer h2 {
	margin-bottom: 30px;
}

#buyer p {
	margin-bottom: 20px;
}

#buyer .container > div {
	display: inline-block;
	vertical-align: top;
	margin-bottom: 40px;
}

#buyer ol {
	background: url(../images/buyer_05.jpg) no-repeat center top;
}
body.for15 #buyer ol {
	background: url(../images/buyer_05.jpg) no-repeat 526px top;
}

#buyer li {
	display: inline-block;
	vertical-align: top;
	margin: 0 15px;
}



/* ---------------------------------------------------------
	#proud-master
--------------------------------------------------------- */
#proud-master { background: #f3efec;
                padding-top: 1px;}
#proud-master figure { margin: 0;}
#proud-master figure img { width: 100%; height: auto;}
#proud-master h2 { color: #042275; font-size: 36px; margin-top: 50px;}
#proud-master h2+p { color: #042275; margin: 30px 0; line-height: 2;}
#proud-master .box { border: #042275 1px solid; padding: 5px;}
#proud-master .box .inner { border: #c9151e 1px solid; padding: 30px;}
#proud-master .box .inner h3 { color: #042275; font-size: 24px;}
#proud-master .box .inner h4 { color: #042275; font-size: 18px; margin-bottom: 15px;}
#proud-master .box .inner h4+p { line-height: 1.4;}

#proud-master .box .inner li {
display: inline-block;
min-height: 1%;
display: block;
*zoom: 1;
margin-top: 30px;
}
#proud-master .box .inner li:after {
content: " ";
display: block;
height: 0;
clear: both;
visibility: hidden;
font-size: 0;
}

#proud-master .box .inner li figure { float: left; width: 30%;}
#proud-master .box .inner li:nth-child(2n) figure { float: right; width: 30%;}
#proud-master .box .inner li div { float: right; width: 68%; text-align: left;}
#proud-master .box .inner li:nth-child(2n) div { float: left; width: 68%; text-align: left;}
#proud-master .btn { padding: 40px 0;}

#proud-master .next10{margin-top: 30px;}