/* Theme Name: lotionsports */
* {
	margin:0;
	padding:0;
	line-break:strict;
	font-family:Meiryo, sans-serif;
	box-sizing:border-box;
}
html { height:100%; font-size:62.5%; }
body { height:100%; background-color:#ffffff; color:#000000; font-size:14px; font-size:1.4em; line-height:1em; }

/* スマホ/タブレット */
@media screen and (max-device-width:1000px) {
	* { font-family:Hiragino Kaku Gothic Pro W3, sans-serif; }
	html { -webkit-text-size-adjust:100%; }
}


ul { list-style-type:none; }

img { width:auto; height:auto; max-width:100%; border:none; vertical-align:bottom; line-height:0; font-size:0; }

a:link { color:#009FE9; text-decoration:none; }
a:visited { color:#009FE9; text-decoration:none; }
a:active { color:#009FE9; text-decoration:none; }
a:hover { color:#009FE9; text-decoration:underline; }

p, dt, dd { line-height:1.8em; }

.wrapper{ width:100%; position:relative; min-height:100%; text-align:center; }
.container { padding-bottom:50px; }
#honbun { padding-top:30px; text-align:left; }
.inner { padding-bottom:55px; width:980px; margin:0 auto; }

/* TB */
@media screen and (max-width:980px) {
	.inner { width:100%; padding-left:10px; padding-right:10px; }
}
/* SP */
@media screen and (max-width:760px) {

}

/* ------------ head ------------ */

#head { background-color:#00A0E9; }
#head .box01 { width:980px; margin:0 auto; }
#head .box01 .col01 { float:left; width:235px; padding:10px 0; }
#head .box01 .col02 { float:left; width:745px; }

.nami {
	background-image:url("img/com_nami.png");
	background-position:top center;
	background-repeat:repeat-x;
	height:71px;
}
/* TB */
@media screen and (max-width:980px) {
	#head .box01 { width:100%; }
	#head .box01 .col01 { width:30%; padding:10px 0 10px 10px; }
	#head .box01 .col02 { width:70%; padding:0 10px 0 0; }
}
/* SP */
@media screen and (max-width:760px) {
	#head .box01 { width:100%; }
	#head .box01 .col01 { float:none; width:50%; padding:10px; }
	.nami { height:36px; background-size:550px; }

	.accordion { border-bottom:solid #ffffff 1px; color:#ffffff; line-height:1.9em;  text-align:left; }
	.accordion a { display:block; }
	.accordion a:link { color:#ffffff; text-decoration:none; }
	.accordion a:visited { color:#ffffff; text-decoration:none; }
	.accordion a:active { color:#ffffff; text-decoration:none; }
	.accordion a:hover { color:#ffffff; text-decoration:none; }

	.accordion ul { display:none;}
	.accordion > li {  }
	.accordion > li > p {
		cursor:pointer;
		font-size:1.6rem;
		padding:5px 0 5px 25px;
		background-color:#000000;
		background-image:url("img/sp_menu.png");
		background-position:5px center;
		background-repeat:no-repeat;
		background-size:10px;
	}
	.accordion > li > ul { border-top:solid #ffffff 1px; }
	.accordion > li > ul > li { font-size:1.4rem; border-bottom:solid #ffffff 1px; }
	.accordion > li > ul > li a { background-color:#222222; padding:15px 5px }
}
/* ------------ indexhead ------------ */

#indexhead {
	position:relative;
	background-image:url("img/index_mv.jpg");
	background-position:top center;
	background-repeat:repeat-x;
	background-size:cover;
	height:648px;
}

#indexhead .logo { width:300px; margin:0 auto; padding-top:60px; }

/* SP */
@media screen and (max-width:760px) {
	#indexhead { height:auto; padding-bottom:30px; }
	#indexhead .logo { width:50%; padding-top:30px; }
}

/* ------------ nav ------------ */

#nav { text-align:right; padding-top:10px; }
#nav li { display:inline; font-weight:bold; padding-left:20px; }

#nav li a:link { color:#ffffff; text-decoration:none; }
#nav li a:visited { color:#ffffff; text-decoration:none; }
#nav li a:active { color:#ffffff; text-decoration:none; }
#nav li a:hover { color:#ffffff; text-decoration:underline; }

.indexnav { width:980px; margin:0 auto;  }

/* TB */
@media screen and (max-width:980px) {
	.indexnav { width:100%; padding:10px 10px 0 0; }
}

/* ------------ pan ------------ */

#pan { width:980px; margin:0 auto; text-align:left; }
#pan li { display:inline; font-size:11px; font-size:1.1rem; line-height:1.2em; padding-right:0.3em; }

#pan a:link { color:#868686; text-decoration:none; }
#pan a:visited { color:#868686; text-decoration:none; }
#pan a:active { color:#868686; text-decoration:none; }
#pan a:hover { color:#868686; text-decoration:none; }

/* TB */
@media screen and (max-width:980px) {
	#pan { width:100%; padding:0 10px; }
}
/* SP */
@media screen and (max-width:760px) {
	#pan { display:none; }
}

/* ------------ h ------------ */

h1 {
	font-size:35px; font-size:3.5rem;
	font-weight:bold;
	line-height:1.2em;
	color:#00A0E9;
	background-image:url("img/com_mark.png");
	background-position:left center;
	background-repeat:no-repeat;
	background-size:32px;
	padding-left:37px;
	margin-bottom:20px;
}

h2 {
	font-size:25px; font-size:2.5rem;
	font-weight:bold;
	line-height:1.2em;
	color:#00A0E9;
	margin-bottom:20px;
	border-left:solid #00A0E9 5px;
	padding-left:10px;
}

/* SP */
@media screen and (max-width:760px) {
	h1 { font-size:2.2rem; background-size:18px; padding-left:25px; }
	h2 { font-size:1.7rem; }
}

/* ------------ ボタン ------------ */

.btn01 .col01 { float:left; width:470px; margin-right:40px; }
.btn01 .col02 { float:left; width:470px; }
.btn01 span { display:block; }
.btn01 .ico { float:left; width:100px; margin-right:20px; }
.btn01 .txt00 { float:left; width:330px; }
.btn01 .txt01 { font-size:55px; font-size:5.5rem; line-height:1.3em; font-weight:bold; }
.btn01 .txt02 { font-size:25px; font-size:2.5rem; line-height:1.2em; font-weight:bold; }
.btn01 .txt03 { font-size:26px; font-size:2.6rem; line-height:1.4em; font-weight:bold; padding-top:20px; }
.btn01 .txt04 { font-size:20px; font-size:2.0rem; line-height:1.2em; font-weight:bold; }

.btn01 a { display:block; background-color:#00A0E9; padding:10px 0 10px 20px; }
.btn01 a:link { color:#ffffff; text-decoration:none; }
.btn01 a:visited { color:#ffffff; text-decoration:none; }
.btn01 a:active { color:#ffffff; text-decoration:none; }
.btn01 a:hover { color:#ffffff; text-decoration:none; background-color:#33B3ED; }

.btn02 .col01 { float:left; width:310px; margin-right:20px; }
.btn02 .col02 { float:left; width:310px; }
.btn02 span { display:block; }
.btn02 .ico { float:left; width:83px; margin-right:20px; }
.btn02 .txt00 { float:left; width:197px; }
.btn02 .txt01 { font-size:30px; font-size:3.0rem; line-height:1.3em; font-weight:bold; }
.btn02 .txt02 { font-size:16px; font-size:1.6rem; line-height:1.2em; }
.btn02 .txt03 { font-size:20px; font-size:2.0rem; line-height:1.2em; font-weight:bold; padding-top:5px; }

.btn02 a { display:block; background-color:#00A0E9; padding:10px 0 10px 10px; }
.btn02 a:link { color:#ffffff; text-decoration:none; }
.btn02 a:visited { color:#ffffff; text-decoration:none; }
.btn02 a:active { color:#ffffff; text-decoration:none; }
.btn02 a:hover { color:#ffffff; text-decoration:none; background-color:#33B3ED; }

/* TB */
@media screen and (max-width:980px) {
	.btn01 .col01 { width:49%; margin-right:2%; }
	.btn01 .col02 { width:49%; }
	.btn01 .ico { width:25%; margin-right:2%; }
	.btn01 .txt00 { width:73%; }
	.btn01 .txt01 { font-size:4.0rem; padding-top:10px; }
	.btn01 .txt02 { font-size:2.0rem; }
	.btn01 .txt03 { font-size:2.0rem; }
	.btn01 .txt04 { font-size:1.6rem; }
	.btn01 a { padding:10px 0 10px 10px; }

	.btn02 .col01 { width:49%; margin-right:2%; }
	.btn02 .col02 { width:49%; }
	.btn02 .ico { width:25%; margin-right:2%; }
	.btn02 .txt00 { width:73%; }
	.btn02 .txt01 { font-size:2.3rem; }
	.btn02 .txt02 { font-size:1.4rem; }
	.btn02 .txt03 { font-size:1.6rem; }
}
/* SP */
@media screen and (max-width:760px) {
	.btn01 .col01 { float:none; width:100%; margin:0 0 20px 0; }
	.btn01 .col02 { float:none; width:100%; }
	.btn01 .ico { width:25%; margin-right:5%; }
	.btn01 .txt00 { width:70%; }
	.btn01 .txt01 { font-size:3.0rem; padding-top:10px; }
	.btn01 .txt02 { font-size:1.8rem; }
	.btn01 .txt03 { font-size:1.8rem; }
	.btn01 .txt04 { font-size:1.6rem; }

	.btn02 .col01 { float:none; width:100%; margin:0 0 20px 0; }
	.btn02 .col02 { float:none; width:100%; }
	.btn02 .ico { width:25%; margin-right:5%; }
	.btn02 .txt00 { width:70%; }
	.btn02 .txt01 { font-size:3.0rem; }
	.btn02 .txt02 { font-size:1.8rem; }
	.btn02 .txt03 { font-size:2.0rem; text-align:center; }
}

/* ------------ index ------------ */

#home .news { border-top:solid #00A0E9 3px; }
#home .news li { border-bottom:dotted #00A0E9 1px; }
#home .news .date { float:left; width:120px; padding:10px 0; font-size:11px; font-size:1.1rem; }
#home .news .txt { float:left; width:860px; line-height:1.6em; padding:10px 0; }
#home .news .txt span { display:block; }
#home .news .txt .tit { font-size:15px; font-size:1.5rem; font-weight:bold; }

#home .news .txt .tit a:link { color:#000000; text-decoration:none; }
#home .news .txt .tit a:visited { color:#000000; text-decoration:none; }
#home .news .txt .tit a:active { color:#000000; text-decoration:none; }
#home .news .txt .tit a:hover { color:#000000; text-decoration:underline; }

#home .rule { margin-top:50px; padding:20px; border:solid #00A0E9 3px; }
#home .rule h2 { font-size:20px; font-size:2.0rem; border-left:none; padding-left:0; }
#home .rule div { text-align:center; }

.sns {
	background-image:url("img/com_foot_bk.png");
	background-position:left top;
	padding:30px 0;
}
.sns .box01 { width:980px; margin:0 auto; }
.sns .box01 .col01 { float:left; width:470px; margin-right:40px; }
.sns .box01 .col02 { float:left; width:470px; }

/* TB */
@media screen and (max-width:980px) {
	#home .news .date { width:15%; }
	#home .news .txt { width:85%; }
	.sns { text-align:center; }
	.sns .box01 { width:100%; padding:0 10px; }
	.sns .box01 .col01 { float:none; width:100%; margin:0 0 20px 0; }
	.sns .box01 .col02 { float:none; width:100%; }
}
/* SP */
@media screen and (max-width:760px) {
	#home .news .date { float:none; width:100%; padding:10px 0 0 0; }
	#home .news .txt { float:none; width:100%; padding:0 0 10px 0; }
	#home .rule { margin-top:30px; padding:10px; }
	#home .rule h2 { font-size:1.5rem; }
}

/* ------------ tokyo ------------ */

#tokyo { line-height:1.8em; }

#tokyo img { display:block; }
#tokyo .box01 .col01 { float:left; width:470px; margin-right:40px; }
#tokyo .box01 .col02 { float:left; width:470px; }
#tokyo .chui { list-style-type:disc; margin-left:15px; }
#tokyo .chui li { font-size:12px; font-size:1.2rem; line-height:1.6em; margin-bottom:10px; }

/* TB */
@media screen and (max-width:980px) {
	#tokyo .box01 .col01 { width:48%; margin-right:4%; }
	#tokyo .box01 .col02 { width:48%; }
}

/* SP */
@media screen and (max-width:760px) {
	#tokyo .box01 .col01 { float:none; width:100%; margin:0 0 40px 0; }
	#tokyo .box01 .col02 { float:none; width:100%; }
}

/* ------------ osaka ------------ */

#osaka { line-height:1.8em; }

#osaka img { display:block; }
#osaka .box01 .col01 { float:left; width:470px; margin-right:40px; }
#osaka .box01 .col02 { float:left; width:470px; }
#osaka .chui { list-style-type:disc; margin-left:15px; }
#osaka .chui li { font-size:12px; font-size:1.2rem; line-height:1.6em; margin-bottom:10px; }

/* TB */
@media screen and (max-width:980px) {
	#osaka .box01 .col01 { width:48%; margin-right:4%; }
	#osaka .box01 .col02 { width:48%; }
}

/* SP */
@media screen and (max-width:760px) {
	#osaka .box01 .col01 { float:none; width:100%; margin:0 0 40px 0; }
	#osaka .box01 .col02 { float:none; width:100%; }
}

/* ------------ ABOUT ------------ */

#about { line-height:1.8em; }

#about img { display:block; }

#about .box01 .fl { float:left; width:640px; margin-right:40px; }
#about .box01 .fr { float:left; width:300px; border:solid #00A0E9 3px; padding:5px; }

/* TB */
@media screen and (max-width:980px) {
	#about .box01 .fl { width:66%; margin-right:4%; }
	#about .box01 .fr { width:30%; }
}
/* SP */
@media screen and (max-width:760px) {
	#about .box01 .fl { float:none; width:100%; margin:0 0 20px 0; }
	#about .box01 .fr { float:none; width:100%; text-align:center; }
}

/* ------------ NEWS ------------ */
#news h2 { font-size:20px; font-size:2.0rem; margin-bottom:10px; }
#news .box01 { border-top:solid #00A0E9 3px; }
#news .kiji { padding:20px 0; border-bottom:dotted #00A0E9 1px; }
#news .kiji .date { font-size:11px; font-size:1.1rem; margin-bottom:10px; }

#news .postnav p { float:left; width:50%; margin-top:20px; }

/* SP */
@media screen and (max-width:760px) {
	#news .postnav p { font-size:1.1rem; }
}

/* ------------ CONTACT ------------ */
#contact p { margin-bottom:15px; }

/* ------------ totop ------------ */

.totop { position:fixed; right:10px; bottom:60px; width:40px; }

/* ------------ foot ------------ */

#foot{ position:absolute; bottom:0; width:100%; height:50px; padding-top:20px; background-color:#00A0E9; }
#foot p { color:#ffffff; font-size:11px; font-size:1.1rem; line-height:1.2em; }

/* ------------ com ------------ */

.mb03 { margin-bottom:3px; }
.mb05 { margin-bottom:5px; }
.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mb30 { margin-bottom:30px; }
.mb40 { margin-bottom:40px; }
.mb50 { margin-bottom:50px; }

.mb1em { margin-bottom:1em; }

.mt10 { margin-top:10px; }

.right { text-align:right; }
.center { text-align:center; }

.aligncenter { display:block; margin:0 auto; }
.alignright { display:block; margin:0 0 0 auto; }

.fontS { font-size:11px; font-size:1.1rem; line-height:1.4em; }
.fontM { font-size:18px; font-size:1.8rem; }

.b { font-weight:bold; }

table { border-collapse:collapse; border-spacing:0; }

.pc { display:block; }
.sp { display:none; }

/* スマホ */
@media screen and (max-width:760px) {
	.fontM { font-size:1.6rem; }

	.pc { display:none; }
	.sp { display:block; }
}

/* ----------------clearfix----------------- */
.cf { zoom:1; }
.cf:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
