@charset "utf-8";
body {
	background: #e2e2e1;
	margin: 0;
	padding: 0;
	text-align: center;
	line-height: 150%;
	font-family: "メイリオ","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","Osaka",sans-serif;
	font-size:14px;
	color: #333;
}

* {
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	padding: 0;
}
#contents a:hover img{
	opacity: 0.8;
	filter: alpha(opacity = 80);	/* IE7用 */
}
#contents a:hover img.over,
#footer a:hover img.over,
#contents a:hover img.current01,
#footer a:hover img.current01{
	opacity: 1.0;
	filter: alpha(opacity = 100);	/* IE7用 */
}
img {
	border: none;
	vertical-align: top;
	max-width:100%;
}
input[type="image"] {
	vertical-align: top;
}
ul, ol {
	list-style: none;
}
* table {
	font-size: 100%;
}

.media_pc {
	display:initial;
}
.media_sp {
	display:none;
}

.br_pc {
	display:initial;
}
.br_sp {
	display:none;
}

/* General
------------------------------------------------------------------- */

/* パディング 下方向 */
.pb05 { padding-bottom: 5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb50 { padding-bottom: 50px !important; }

/* パディング 上方向 */
.pt05 { padding-top: 5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt30 { padding-top: 30px !important; }
.pt40 { padding-top: 40px !important; }
.pt50 { padding-top: 50px !important; }


/* マージン 下方向 */
.mt05 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px !important; }
.mt50 { margin-top: 50px !important; }

/* マージン 上方向 */
.mb00 { margin-bottom: 0px !important; }
.mb05 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb80 { margin-bottom: 80px !important; }

/* マージン 左方向 */
.ml10 { margin-left: 10px !important; }
.ml20 { margin-left: 20px !important; }

/*\*/
* html .clearfix {
	height: 1em;
	overflow: visible;
}

.clearfix:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	overflow: hidden;
	zoom: 1;
}
/* */

/* 2カラム */
.twoColumn { overflow:hidden; }
.leftColumn { float:left; }
.rightColumn { float:right; }

/* インデント */
.ind1 { margin-left:1em; text-indent:-1em; }
/*.ind2 { margin-left:2em; text-indent:-2em; }*/
.ind2 { display:inline-block; margin-left:2em; }

/* テキスト
------------------------------------------------------------------- */
a:link{
	color: #3a5646;
	text-decoration: underline;
}
a:visited{
	color: #3a5646;
}
a:hover{
	color: #3a5646;
	text-decoration: underline;
}
a:active{
	color: #3a5646;
}

/* リンク 文字色 継承 */
a.linkCInit:link,
a.linkCInit:visited{
	color:inherit;
}

a.linkCInit:hover{
	opacity:.7; 
}

/* ○○について txtLink */
.aboutLink a:link,
.aboutLink a:visited {
	font-size:85%;
	font-weight:bold;
}

/* 矢印アイコン btnLink */
.arrowBtn {
	display: inline-block;
	min-height: 16px;
	background: url(../img/ico_arrow.gif) left top no-repeat;
	text-indent:13px;
	font-size:90%;
	line-height: 1.3em;
}

.arrowBtn a:link,
.arrowBtn a:visited {
	text-decoration:none;
}

.arrowBtn a:hover {
	text-decoration:underline;
}

/* 段落 */
.txtL { text-align:left !important; }
.txtC { text-align:center; }
.txtR { text-align:right; }

.fwb { font-weight:bold; }
.fwn { font-weight:normal; }

.large { font-size:18px; }
.x-large { font-size:22px; }

/* ヘッダー
------------------------------------------------------------------- */
#header{
	width: 100%;
	background: url(../img/header_bg.png);
	border-bottom:4px solid #a7b7ae;
	text-align: center;
}

#header_box {
	width:950px;
	height:43px;
	text-align:left;
	margin: 0 auto;
	padding-top:20px;
	padding-bottom:20px;
}

.header_ttl {
	float:left;
	width:425px;
	padding-top:10px;
	color:#FFF;
}

#header_logo {
	float:left;
	width:52px;
	margin-right:23px;	
}
#header_nav {
	float:right;
	overflow:hidden;
	width:425px;
	margin-top:5px;
	text-align:right;
}

#header_nav li {
	float:right;
	width:200px;
	border-radius:3px 3px 3px 3px;
	margin-left:10px;
	background-color:#FFF;
	font-size:80%;
	font-weight:bold;
	text-align:center;
}

#header_nav li a:link {
	display:block;
	padding:5px 0;
	text-decoration:none;
	color:#405f4d;
}
#header_nav a:hover {
	background-color:#e7e7e7;
}

/* 本文エリア
------------------------------------------------------------------- */
#contents {
	width: 950px;
	margin: auto;
	z-index: 0;
	text-align:left;
}

#contents .contentWrapper {
	padding:40px 20px;
	margin-top:20px;
	background-color:#FFF;
}

#contents .contentTitle {

}

#contents .contentTitle ul {
	overflow:hidden;
	width:868px;
	margin:30px auto;
	color:#405f4d;
	font-size:110%;
	font-weight:bold;
	line-height:2em;
}

#contents .contentTitle li {
	float:left;
	width:49.5%;
	margin-right:1%;
}

#contents .contentTitle li:nth-child(even) {
	margin-right:0;
}

#contents .contentTitle h1 {
	display:inline-block;
	font-size:28px;
	font-weight:bold;
	margin-bottom:20px;
	line-height:1.6;
}
#contents .contentTitle h1 span { display:block; font-size:13px; }

#contents .contentTitle p.ttlComment {
	display:inline-block;
}

/* コンテンツ :　予約 */
#contents #loginArea {
	padding:40px 20px;
	border:1px solid #f4f4f4;
	text-align:center;
	background-color:#fafcfd;
}

#contents #loginArea h2 {
	padding:3px 0 3px 10px;
	border-left:16px solid #ccc;
	text-align:left;
	font-size:120%;
	font-weight:bold;
	line-height:1.6em;
}

#contents #loginArea h2 span { font-size:75%; }

#contents #loginArea .twoColumn {
	overflow:hidden;
}

#contents #loginArea .frameBox {
	box-sizing:border-box;
	padding:20px;
	border:2px solid #ccc;
}

#contents #loginArea .twoColumn .leftColumn {
	float:left;
	width:49.5%;
}

#contents #loginArea .twoColumn .rightColumn {
	float:right;
	width:49.5%;
}

#contents #loginArea .newAccount {
	padding:15px;
	background-color:#FFF;
	text-align:center;
}

#contents #loginArea .tableTitle {
	width:70%;
	margin:40px auto 10px;
	text-align:left;
	font-weight:bold;
}

#contents #loginArea table {
	box-sizing:border-box;
	width:70%;
	border:1px solid #ccc;
	border-collapse:collapse;
	margin:0 auto;
}

#contents #loginArea table th,
#contents #loginArea table td {
	box-sizing:border-box;
	width:50%;
	padding:15px;
	border:1px solid #ccc;
	text-align:left; 
}

/* コンテンツ :　予約 (色設定) */
#contents #loginArea .freeAccount { border-color:#0c38c6; background-color:#ddeafc; color:#0c38c6; }
#contents #loginArea .tollAccount { border-color:#e10404; background-color:#feebed; color:#e10404; }
#contents #loginArea .noAccount  { border-color:#01863a; background-color:#f3fbf3; color:#01863a; }

/* コンテンツ :　共通　文字 (色設定) */
#contents .freeAccountColor { color:#0c38c6; }
#contents .tollAccountColor { color:#e10404; }
#contents .noAccountColor { color:#01863a; }

#contents #loginArea .freeAccount h2 { border-color:#0c38c6; }
#contents #loginArea .tollAccount h2 { border-color:#e10404; }
#contents #loginArea .noAccount h2 { border-color:#01863a; display:inline-block; line-height:1.3em; }

#contents #loginArea table th span { padding-right:5px; }
#contents #loginArea table th span.freeAccount { border:none; background-color:transparent; color:#0c38c6; }
#contents #loginArea table th span.tollAccount  { border:none; background-color:transparent; color:#e10404; }
#contents #loginArea table th span.noAccount { border:none; background-color:transparent; color:#01863a; }

/* コンテンツ :　リンクボタン */
.btn {
	display:inline-block;
	border:1px solid #e1e1e1;
	border-radius:3px 3px 3px 3px;
	text-align:center;
	margin:0 auto;
	background-color:#f6f5f5;
	color:#555;
}

.btn span {
	padding:5px 0px 5px 1px;
	border-radius:2px 2px 2px 2px;
	margin-right:20px;
	font-size:50%;
	vertical-align:bottom;
	background-color:#3a5646;
	color:#FFF;
}

.btn a:link,
.btn a:visited {
	display:block;
	padding:12px 45px;
	color:#555;
	text-decoration:none;
}

.btn a:hover,
.btn a:active {
	background-color:#e7e7e7;
}


/* コンテンツ :　支払、チケット引取 */
#contents #payInfoArea {
	border-bottom:1px solid #ccc;
	margin-bottom:40px;
}

#contents #payInfoArea .tableTitle {
	width:90%;
	margin:40px auto 10px;
	text-align:left;
	font-weight:bold;
}

#contents #payInfoArea table {
	box-sizing:border-box;
	width:90%;
	border:1px solid #ccc;
	border-collapse:collapse;
	margin:0 auto;
}

#contents #payInfoArea table th,
#contents #payInfoArea table td {
	box-sizing:border-box;
	width:50%;
	padding:15px;
	border:1px solid #ccc;
}

#contents #payInfoArea table th { width:22%; text-align:left; }
#contents #payInfoArea table td { width:34%; text-align:center; }

#contents #payInfoArea table td span {
	font-size:80%;
	line-height:1.2em;
}

#contents #payInfoArea ul {
	width:90%;
	margin:20px auto 30px;
}

#contents #payInfoArea ul li {
	margin-left: 1em;
	text-indent:-1em;
}

#contents #contactArea .place {
	margin-bottom:5px;
	font-size:90%;
	font-weight:bold;
}

#contents #contactArea .tel {
	font-size:200%;
}

#contents #contactArea .tel span {
	font-size:50%;
	font-weight:normal;
}

/* コンテンツ :　利用方法　& 登録方法 & ファミポート */

#contents #guideFlow {
	padding:0 25px;
	margin-bottom:30px;
	/*text-align:center;*/
}

#contents #guideFlow li {
	display:inline-block;
	margin:0 5px;
}

#contents #guideFlow li::after {
	display:inline-block;
	content:'>';
	margin-left:15px;
}

#contents #guideFlow li:last-child::after {
	display:inline-block;
	content:'';
	margin-left:0;
}

#contents .flowBox {
	padding:5px;
	border:1px solid #eae9e9;
	margin-bottom:30px;
	background:#FFF;
}

#contents .flowBox .flowInner {
	padding:25px 24px;
	background:#fafbf4;
}

#contents .flowBox .flowContent {
	position:relative;
}

#contents .flowBox h2,
#contents .flowBox h3 {
	margin-bottom:30px;
	font-size:130%;
	font-weight:bold;
}

#contents .flowBox dl > dt{
	margin-top:30px;
}

#contents .flowBox dl > dt:first-child {
	margin-top:0;
}

#contents .flowBox .strong {
	margin-bottom:15px;
	font-size:105%;
	font-weight:bold;
}

#contents .flowBox .lead{
	padding-left:10px;
	border-left:8px solid #333;
	line-height:1.3em;
}

#contents .flowBox .nextTxt {
	position:absolute;
	right:20px;
	bottom:0;
	margin-bottom:0;
	text-align:right;
}

#contents .flowBox .caution {
	font-size:85%;
	line-height:1.7em;
}

#contents .flowBox .nextTxt .caution {
	font-size:85%;
}

#contents .flowBox .txtRed {
	color:#e10404;
}

#contents .flowBox .borderDot {
	padding-bottom:30px;
	border-bottom:1px dotted #a8b8af;
	margin-bottom:30px;
}

#contents .flowBox .leftColumn {
	width:400px;
	text-align:center;
}

#contents .flowBox .rightColumn {
	width:420px;
}

#contents .ifFlow > .twoColumn .leftColumn,
#contents .ifFlow > .twoColumn .rightColumn {
	width:450px;
}

#contents .flowBox .imgBox {
	width:400px;
	margin:0 auto;
	text-align:center;
}

#contents .flowBox .towInnerBox ul {
	overflow:hidden;
	margin-bottom:20px;
}

#contents .flowBox .towInnerBox ul li {
	width:200px;
	float:left;
	margin-right:20px;
}

#contents .flowBox .towInnerBox ul li:last-child {
	margin-right:0;
}

#contents .flowBox .towInnerBox ul li img {
	width:100%;
}


#contents .ifFlow .flowBox img {
	width:380px;
	margin-bottom:20px;
}

#contents .flowBox .imgS {
	width:200px;
}

#contents #loginGuideTop ul li {
	margin-bottom:30px;
}

#contents #loginGuideTop ul li > span {
	font-size:85%;
	font-weight:normal;
}

#contents .guidePageTtl {
	padding:15px 30px;
	margin-bottom:30px;
	/*text-align:center;*/
	font-size:130%;
	background:#243f2f;
	color:#FFF;
}

#contents .triArrow {
	width: 0px;
	height: 0px;
	border-style: solid;
	border-color: #3c5748 transparent transparent transparent;
	border-width: 24px 24px 0 24px;
	margin:0 auto 30px;
}

#contents #getTicketArea {
	line-height:1.8em;
}

#contents #getTicketArea .twoColumn {
	margin-bottom:30px;
}

#contents #getTicketArea .innerWidth {
	 padding:0 20px;
}

#contents #getTicketArea > .twoColumn > .leftColumn {
	width:480px;
}

#contents #getTicketArea > .twoColumn > .rightColumn {
	width:370px;
}


#contents #getTicketArea .rightColumn {
	text-align:center;
}

#contents #getTicketArea .rightColumn img.imgFamiport {
	width:161px;
	height:auto;
}

#contents #getTicketArea .caution {
	font-size:90%;
}

#contents #getTicketArea .ifStyleDl {
	overflow:hidden;
	margin-bottom:30px;
}

#contents #getTicketArea .ifStyleDl dt {
	padding:15px 0;
	border:1px solid #ccc;
	text-align:center;
	font-size:100%;
}

#contents #getTicketArea .ifStyleDl > dd {
	float:left;
	box-sizing:border-box;
	width:50%;
	padding:25px;
	border:1px solid #ccc;
	border-top:none;
	font-size:90%;
}

#contents #getTicketArea .ifStyleDl > dd:last-child{
	border-left:none;
}

#contents .cautionBox {
	padding:0 20px;
}

#contents .cautionBox .inner {
	padding:25px 50px;
	border:10px solid #eee;
	color:#777;
}

#contents .cautionBox .strong {
	margin-bottom:10px;
	font-size:105%;
	font-weight:bold;
}

#contents .cautionBox ul {
	overflow:hidden;
	padding-left:1em;
}

#contents .cautionBox ul li {
	box-sizing:border-box;
	/*float:left;*/
	/*width:50%;*/
	text-indent:-.5em;
}

#contents .cautionBox ul li::before {
	display:inline-block;
	content:'●';
}


/* コンテンツ :　セキュリティーコードについて*/
#contents #cardArea{
	margin-top:20px;
}

#contents #cardArea h2 {
	margin-bottom:20px;
}

#contents #cardArea .square {
	padding-left:5px;
	border-left:8px solid #333;
	margin-bottom:10px;
	line-height:1.3em;
	
}

#contents #cardArea ul {
	margin-bottom:20px;
}

#contents #cardArea ul li {
	display:inline-block;
	margin-right:20px; 
}

#contents #cardArea ul li img {
	width:350px;
}

/* 3Dセキュア（本人認証サービス）について
------------------------------------------------------------------- */
#secure_logo_list{
	margin-top:20px;
}

#secure_logo_list li{
	display:inline-block;
	margin-right:30px;
}

/* フッター
------------------------------------------------------------------- */
#footer{
	width:100%;
	background-color:#243f2f;
}

#footer #footerInner {
	position:relative;
	width:950px;
	padding:30px 0;
	margin:0 auto;
}

#footer #footerInner .footercontent{
	overflow:hidden;
}

#footer #copyright {
	float:left;
	overflow:hidden;
	/*width:50%;*/
}
#footer #copyright img {
	float:left;
	margin-right:20px;
}

#footer #copyright p {
	float:left;
	font-size:70%;
	padding-top:7px;
	color:#FFF
}

#footer #footer_nav {
	float:right;
	overflow:hidden;
	width:auto;
	margin-top:10px;
	margin-bottom:20px;
	line-height:1em;
}


#footer #footer_nav li {
	display:inline-block;
	width:auto;
	padding:0 20px;
	font-size:85%;
	border-left:1px solid #FFF;
}

#footer #footer_nav li:last-child {
	border-right:1px solid #FFF;
}

#footer #footer_nav li a:link,
#footer #footer_nav li a:visited {
	color:#FFF;
	text-decoration:none;
}

#footer #footer_nav li a:hover,
#footer #footer_nav li a:active {
	text-decoration:underline;
}

#sp_nav{
	display:none;
}

#topUp {
	position:absolute;
	top:-24px;
	right:0;
}

/* 汎用パーツ
------------------------------------------------------------------- */

ol.terms-wrap { list-style-type:none; margin: 20px 0 0; padding:0; }
ol.terms-wrap > li { border-bottom: dotted 1px #e1e1e1; padding-bottom: 15px; margin-bottom: 15px;  }
    ol.terms-wrap > li:last-child { border-bottom:none; padding-bottom:0; }
	ol.terms-wrap > li .head-privacy { margin-left:1em; text-indent:-1em; padding-bottom:10px; font-weight:bold; }
	
	ol.terms-wrap > li > ol { list-style-type: decimal; margin-left:20px; }
	ol.terms-wrap > li > ol li { margin-bottom:10px; margin-top:10px; }
	
	ol.terms-wrap > li > ol > li > ol { list-style-type:none; margin:0; padding:0; }
	ol.terms-wrap > li > ol > li > ol li {margin-left:2.6em; text-indent:-2.6em; margin-bottom:10px; margin-top:10px; }
	
	ol.terms-wrap > li p { margin-bottom:10px; /*text-indent:0;*/ }
	
	ol.terms-wrap ul { margin:0; padding:0; }
	ol.terms-wrap > li > ol > li > ul li { text-indent:0; }
	
table.table-1 { border-collapse:collapse; width:100%; }
table.table-1 th,
table.table-1 td { border-bottom:solid 1px #e1e1e1; border-top:solid 1px #e1e1e1; padding:20px; border-collapse:collapse; }
table.table-1 th { font-weight:normal; text-align:left; width:200px; background-color:#f3f3f3; }
table.table-1 td ul li { list-style-type:disc; margin-left:20px; }
