@charset "utf-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Slabo+27px);

@media screen and (min-width: 768px) {
/*==========================================
 pc/tab
===========================================*/


/*clearfix*/
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

/*-----------------------

header

-----------------------*/

#header_box {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
 background: #f3f3f3;
}

#header {
 margin: 0px auto;
 padding: 0px;
 width: 1000px;
 height: 60px;
}

#header h1 {
 margin: 0px;
 padding: 0px;
 width: 120px;
 height: 60px;
 font: normal normal 20px/60px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 background: #dbdbdb;
 float: left;
 overflow: hidden;
}

#header h1 a,#header h1 a:hover {
 font: normal normal 20px/60px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 text-decoration: none;
 display: block;
}

#menu-starry_menu li:nth-child(4),#menu-starry_menu li:nth-child(5){
 background: url(/images/nav_ico.png) no-repeat 0 4px;
 text-indent: 1.5em;
}

#nav {
 margin: 0 0 0 30px;
 padding: 20px 0 0 0;
 float: left;
 width: 800px;
}

#nav li {
 margin: 0px;
 padding: 0 15px 0 0;
 float: left;
 font: normal normal 16px/26px 'Slabo 27px', serif;
 color: #000;
 text-align: left;
}

#nav li a,#nav li a:hover {
 font: normal normal 16px/26px 'Slabo 27px', serif;
 color: #000;
 text-align: left;
 text-decoration: none;
}

#social {
 margin: 0px;
 padding: 0;
 float: right;
}

#social li {
 padding: 0 10px 0 0;
}



/*-----------------------

共通

-----------------------*/

.pb30 {
 padding-bottom: 30px;
}

#contents_top {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
}

.box {
 margin: 0px auto;
 padding: 0px;
 width: 1000px;
}

#contents {
 margin: 0px auto;
 padding: 0 0 50px 0;
 width: 1000px;
}

#contents02 {
 margin: 0px auto;
 padding: 0px;
}

.tit {
 margin: 0px auto 30px auto;
 padding: 10px 0;
 font: normal bold 50px/60px 'Slabo 27px', serif;
 color: #FFF;
 text-align: center;
 background: #000;
}

.tit02 {
 margin: 0px auto;
 padding: 10px 0;
 font: normal bold 50px/60px 'Slabo 27px', serif;
 color: #FFF;
 text-align: center;
 background: #000;
}

#payment_title,
#service_title,
#rule_title {
 margin: 20px auto !important;
 padding: 5px !important;
 width: 990px;
 font: normal bold 18px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
 color: #000;
 text-align: left;
 border-bottom: 2px dotted #000;
}

#join_text,
#payment_text,
#service_text,
.entry_rule,
#entry_area,.txt_01,.entry_rule,.page_contents form {
 font: normal normal 14px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
 color: #000;
 text-align: left;
}

.txt_01 a,.txt_01 a:hover {
 font: normal normal 14px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #db0007;
 text-align: left;
}

.txt_01 strong {
 font: normal normal 14px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #db0007;
 text-align: left;
}

.txt_02 {
 margin: 0px auto;
 padding: 10px 0;
 font: normal normal 20px/30px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #000;
 text-align: center;
}

.meg img {
 margin: 0px auto;
 padding: 0;
 width: 100%;
 height: auto;
 vertical-align: bottom;
}

.trade_mark {
 margin: 0px auto !important;
 padding: 0px;
 width: 1000px;
 font: normal normal 20px/30px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #000;
 text-align: left;
}

 

/*-----------------------

footer

-----------------------*/

#footer {
 margin: 0px auto;
 padding: 20px 0;
 width: 100%;
 background: #acacac;
}

#footer ul {
 margin: 0px auto;
 padding: 15px 0;
 width: 1000px;
}

#footer li {
 margin: 0px;
 padding: 5px;
 display: inline-block;
}

#footer p {
 font: normal normal 12px/22px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
}

#footer p a,#footer p a:hover {
 font: normal bold 12px/22px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 text-decoration: none;
}
}

@media screen and (max-width: 767px) {
/*==========================================
 smp
===========================================*/

body {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
}

img {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
 height: auto;
 vertical-align: bottom;
}

/*clearfix*/
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

/*-----------------------

header

-----------------------*/

#header_box {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
 background: #f3f3f3;
}

#header {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
 height: 70px;
 position: relative;
}

#header h1 {
 margin: 0px;
 padding: 0px;
 width: 160px;
 height: 69px;
 font: normal normal 24px/69px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 background: #dbdbdb;
 overflow: hidden;
}

#header h1 a,#header h1 a:hover {
 font: normal normal 24px/70px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 text-decoration: none;
 display: block;
}

.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.menu-trigger {
	position: fixed;
	width: 50px;
	height: 44px;
 top :10px;
	right: 10px;
 z-index: 1002;
}
.menu-trigger span {
	position: absolute;
	right: 0;
	width: 100%;
	height: 4px;
	background-color: #000;
	border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 20px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}

.menu-trigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(20px) rotate(-45deg);
	transform: translateY(20px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
	-webkit-transform: translateY(-20px) rotate(45deg);
	transform: translateY(-20px) rotate(45deg);
}

#nav {
 margin: 0px;
 padding: 20px 0 0 0;
 display: none;
 background: #f3f3f3;
 z-index: 1001;
 width: 100%;
 height: 100%;
 position: fixed; 
 top: 0;
 overflow: auto;
}

#nav li {
 margin: 0px;
 padding: 0 0 20px 0;
 font: normal normal 18px/28px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
}

#nav li a {
 font: normal normal 18px/28px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 text-decoration: none;
 display: block;
}

#nav li .ico {
 vertical-align: middle;
 padding: 0 5px 0 0;
 width: 5%;
}

#social li {
 margin: 0px auto;
 width: 10%;
}



/*-----------------------

共通

-----------------------*/

.pb30 {
 padding-bottom: 30px;
}

#contents_top {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
}

.box {
 margin: 0px auto;
 padding: 0px;
 width: 100%;
}

#contents {
 margin: 0px auto;
 padding: 0 0 30px 0;
 width: 90%;
}

#contents_sp {
 margin: 0px auto;
 padding: 0px;
 width: 90%;
}

#contents02 {
 margin: 0px auto;
 padding: 0px;
}

.tit {
 margin: 0px auto 30px auto;
 padding: 10px 0;
 font: normal bold 50px/60px 'Slabo 27px', serif;
 color: #FFF;
 text-align: center;
 background: #000;
}

.tit02 {
 margin: 0px auto;
 padding: 10px 0;
 font: normal bold 50px/60px 'Slabo 27px', serif;
 color: #FFF;
 text-align: center;
 background: #000;
}

#payment_title,
#service_title,
#rule_title {
 margin:20px auto !important;
 font: normal bold 18px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
 color: #000;
 text-align: left;
 border-bottom: 2px dotted #000;
}

#join_text,
#payment_text,
#service_text,
.entry_rule,
#entry_area,
.txt_01,.entry_rule,.page_contents form {
 font: normal normal 14px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
 color: #000;
 text-align: left;
}

.txt_01 a,.txt_01 a:hover {
 font: normal normal 14px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #db0007;
 text-align: left;
}

.txt_01 strong {
 font: normal normal 14px/24px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #db0007;
 text-align: left;
}

.txt_02 {
 margin: 0px auto;
 padding: 10px 0;
 font: normal normal 20px/30px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #000;
 text-align: center;
}

.meg img {
 margin: 0px auto;
 padding: 0;
 width: 100%;
 height: auto;
 vertical-align: bottom;
}

.trade_mark {
 margin: 0px auto !important;
 padding: 0px;
 width: 90%;
 font: normal normal 20px/30px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 color: #000;
 text-align: left;
}

/*-----------------------

footer

-----------------------*/

#footer {
 margin: 0px auto;
 padding: 20px 0;
 width: 100%;
 background: #acacac;
}

#footer ul {
 margin: 0px auto;
 padding: 15px 0;
 width: 90%;
}

#footer li {
 margin: 0px;
 padding: 2%;
 width: 46%;
 display: inline-block;
}

#footer p {
 font: normal normal 12px/22px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
}

#footer p a,#footer p a:hover {
 font: normal bold 12px/22px 'Slabo 27px', serif;
 color: #000;
 text-align: center;
 text-decoration: none;
}

}