html { padding:0px; margin:0px; }
body { padding:0px; margin:0px; background-color:#fff; }
img  { margin:0px; border-style:none; display:block; }

td:not([class]) { padding:0px; }


@media (orientation: portrait) {
	* {
		font-family:"游明朝体","YuMincho","游明朝","Yu Mincho","ヒラギノ明朝 Pro","Hiragino Mincho Pro","メイリオ","Meiryo",sans-serif;
		font-size:3.5vw;
	}
	
	*.fsmall { font-size:3.5vw; }
	div#email { margin:0px; padding:0px; font-size:3.5vw; color:#33f; text-decoration:underline; cursor:pointer; }
	
	table#menuBtnFrame {
		margin:0px;border-collapse:collapse;
		position:fixed;
		margin:0;top:0;left:0;width:100%;height:42px;
		background:rgba(135,150,95,1);
		z-index:300;
	}
	table#menuBtnFrame tr td {
		padding:3px;text-align:right;
	}
	img#menuBtn { width:36px;height:36px;display:inline-block;cursor:pointer; }
	
	div#menu {
		position:fixed;
		margin:0;top:42px;left:0;width:100%;height:100vh;
		background:rgba(135,150,95,1);
		display:none;
		z-index:200;
	}
	div.nMenu {
		margin:24px 12px;
		padding:6px;
		border:2px solid rgba(255,255,255,0.8);
		border-radius:10px;
		background:rgba(255,255,255,1);
		color:rgba(135,150,95,1);
		font-size:3vw;
		font-weight:bold;
		text-align:center;
	}
	div.mMenu {
		margin:24px 12px;
		padding:6px;
		border:2px solid rgba(255,255,255,0.8);
		border-radius:10px;
		color:rgba(255,255,255,1);
		font-size:3vw;
		font-weight:bold;
		text-align:center;
		cursor:pointer;
	}
	div.mMenu:hover {
		background:rgba(190,170,55,1);
	}


	div#mainFrame {	
		margin:0px;width:100%;height: calc(100vh - 200px);
		padding:160px 0px 0px 0px;
		background-image:url(./imgs/top_back.jpg?ver=2);
		background-position:center;
		background-repeat:no-repeat;
		background-size: cover;
	}
	table#titleFrame {
		margin:0px auto;border-collapse:separate;border-spacing:1.5vw;
		background:rgba(255,255,255,0.8);
	}
	tr.ttl01 td {	
		background:rgba(135,150,95,0.8);
		width:10vw;height:10vw;text-align:center;
		font-size:6vw;font-weight:bold;color:#fff;
	}
	tr.ttl02 td {	
		background:rgba(190,170,55,0.8);
		width:10vw;height:10vw;text-align:center;
		font-size:6vw;font-weight:bold;color:#fff;
	}
	td.ttl03 {	
		background:rgba(160,50,110,0.8);
		width:12vw;height:18vw;text-align:center;
		font-size:8vw;font-weight:bold;color:#fff;
	}
	
	
	table#infoFrame {	
		margin:0px;width:100%;border-collapse:collapse;
		z-index:100;
	}
	table#infoFrame2 {	
		margin:42px 0px 0px 0px;width:100%;border-collapse:collapse;
		z-index:100;
	}
	
	table.infoArea {
		margin:0px auto;border-collapse:separate;border-spacing:4px;
	}
	table.linkIcon {
		margin:0px auto;border-collapse:separate;border-spacing:12px;
	}
	td#cpName { padding:0vw 2vw;border-bottom:1px solid #999; font-size:6vw; }
	
div.sectTitle {
	margin:0px auto;width:90%;
	padding:4px 0px 4px 24px;
	background-image:url(./imgs/section_back.png);
	font-size:3vw;
	font-weight:bold;
}

table.centerTable {
	margin:0px auto;max-width:90%;border-collapse:collapse;
}
td.listTitle {
	padding:6px;
	border:1px solid rgba(135,150,95,1);
	background:rgba(190,170,55,1);
	color:rgba(255,255,255,1);
	font-size:2.6vw;
	font-weight:bold;
	text-align:center;
}
td.listBody {
	padding:6px;
	border:1px solid rgba(135,150,95,1);
	font-size:2.2vw;
}

td.vTop { vertical-align:top; }
td.udLine { border-bottom:1px solid rgba(96,96,96,1); }


	img.linkImgs {
		width:10vw; cursor:pointer;
	}
	
	table#footFrame {
		margin:0px;width:100%;border-collapse:collapse;
		background:rgba(160,50,110,1);
		z-index:120;
	}
	td.footArea {
		padding:2vw;text-align:center;font-size:3.5vw;
		font-weight:bold;color:#fff;
	}
}


@media (orientation: landscape) {
	* {
		font-family:"游明朝体","YuMincho","游明朝","Yu Mincho","ヒラギノ明朝 Pro","Hiragino Mincho Pro","メイリオ","Meiryo",sans-serif;
		font-size:1.2vw;
	}
	
	*.fsmall { font-size:2vw; }
	div#email { margin:0px; padding:0px; font-size:2vw; color:#33f; text-decoration:underline; cursor:pointer; }
	
	div#mainFrame {	
		margin:0px;width:100%;height:100vh;border-collapse:collapse;
		background-image:url(./imgs/top_back.jpg);
		background-position:center;
		background-repeat:no-repeat;
		background-size: cover;
	}
	table#titleFrame {
		margin:0px auto;border-collapse:separate;border-spacing:1vw;
		background:rgba(255,255,255,0.8);
	}
	tr.ttl01 td {	
		background:rgba(135,150,95,0.8);
		width:6vw;height:6vw;text-align:center;
		font-size:3.5vw;font-weight:bold;color:#fff;
	}
	tr.ttl02 td {	
		background:rgba(190,170,55,0.8);
		width:6vw;height:6vw;text-align:center;
		font-size:3.5vw;font-weight:bold;color:#fff;
	}
	td.ttl03 {	
		background:rgba(160,50,110,0.8);
		width:12vw;height:12vw;text-align:center;
		font-size:6vw;font-weight:bold;color:#fff;
	}
	
	
	table#infoFrame {	
		margin:0px;width:100%;border-collapse:collapse;
		z-index:100;
	}
	table.infoArea {
		margin:0px auto;border-collapse:separate;border-spacing:4px;
	}
	table.linkIcon {
		margin:0px auto;border-collapse:separate;border-spacing:12px;
	}
	td#cpName { padding:0vw 2vw;border-bottom:1px solid #999; font-size:4vw; }
	
	img.linkImgs {
		width:10vw; cursor:pointer;
	}
	
	table#footFrame {
		margin:0px;width:100%;border-collapse:collapse;
		background:rgba(160,50,110,1);
		z-index:150;
	}
	table#footFrame tr td {
		padding:1.5vw;text-align:center;font-size:1.7vw;
		font-weight:bold;color:#fff;
	}
}

.w180 { width:180px; }

.btnExe { display:inline-block; position:relative; z-index:2; margin:0px; overflow:hidden; font-weight:bold; text-align:center; cursor:pointer; }
.btnExe::before, .btnExe::after { position:absolute; z-index:-1; display:block; content:''; }
.btnExe, .btnExe::before, .btnExe::after { box-sizing:border-box; transition:all 0.1s; }
.btnExe:hover { color:#fff; }

.bsS { height:28px; border-radius:4px; line-height:26px; font-size:11px; }
.bsM { height:32px; border-radius:6px; line-height:30px; font-size:14px; }
.bsL { height:48px; border-radius:12px; line-height:46px; font-size:18px; }
.bsM2 { height:64px; border-radius:6px; line-height:30px; font-size:14px; }

.bcR { border:2px solid #933;color:#600; background:linear-gradient(180deg, #fff, #ddd); }
.bcR::after { top:-100%; width:100%; height:100%; }
.bcR:hover::after { top:0%; background:linear-gradient(180deg, #600, #000); }

.bcG { border:2px solid #393; color:#030; background:linear-gradient(180deg, #fff, #ddd); }
.bcG::after { top:0%; left:-100%; width:100%; height:100%; }
.bcG:hover::after { left:0%; background:linear-gradient(180deg, #030, #000); }

.bcB { border:2px solid #339; color:#003; background:linear-gradient(180deg, #fff, #ddd); }
.bcB::after { top:100%; left:0%; width:100%; height:100%; }
.bcB:hover::after { top:0%; background:linear-gradient(180deg, #003, #000); }

.bcN { border:2px solid #999; color:#666;cursor:not-allowed; pointer-events:none; }
.bcN::after { top:100%; left:0%; width:100%; height:100%; }
.bcN:hover::after { top:0%; background-color:#999; }