@charset "utf-8";

html {
	background: url(/images/bg-magic-img01-pc.png) center top no-repeat;
	width: 100%;
	min-height: 100%;
	background-color: #fff;
}

body {

	width: 100%;
	min-height: 100%;
	color: #000;
	font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "游ゴシック", YuGothic, sans-serif;
	font-size: 14px;
	line-height: 1.6;
}

a:link {
	color: #ff6f83;
	text-decoration: none;
}
a:visited {
	color: #ff6f83;
	text-decoration: none;
}
a:hover {
	color: #ff6f83;
	text-decoration: underline;
}
a:active {
	color: #ff6f83;
	text-decoration: underline;
}
a:hover {
	opacity: 0.7;
}


/* --------------------------------------------------
-------------------------------------------------- Clearfix */

.cf:before, .cf:after {
	content:"";
	display:table;
}
.cf:after {
	clear:both;
}
.cf {
	*zoom:1;
}


/* -------------------------------------------------- ページ全体 */

#wrapper {
	position: absolute;
	width: 100%;
}

#contents {
	position: relative;
	width: 100%;
	min-height: 600px;
	background: url(/images/bg-frame-img01-pc.png) center 0 no-repeat;
}

#main {
	position: relative;
	margin: 0 auto;
	padding: 40px 0 0 0;
	width: 1200px;
}

.box {
	margin: 0 auto 74px auto;
	width: 896px;
	border: 2px solid #b8a050;
	background-color: rgba(255, 255, 243, 0.8);
	background-image: url(/common/images/box-courner-bg01-pc.png), url(/common/images/box-courner-bg02-pc.png), url(/common/images/box-courner-bg03-pc.png), url(/common/images/box-courner-bg04-pc.png); 
	background-position: left top, right top, left bottom, right bottom;
	background-repeat: no-repeat;
}
.box .inner {
	margin: 3px;
	padding: 22px 74px 27px 74px;
	border: 1px solid #b8a050;
}
.box .center_frame {
	margin: -46px 0 0 -80px;
	width: 900px;
	height: 37px;
	background: url(/common/images/box-frame01-pc.png) center top no-repeat;
}

/* -------------------------------------------------- ヘッダー */

#header {
	position: relative;
	z-index: 500;
	display: block;
	background: url(/common/images/header-bg01-pc.png) center top repeat-x;
	overflow: hidden;
	margin: 0 0 9px 0;
	height: 102px;
}
#header .inner {
	display: block;
	margin: 0 auto;
	width:1200px;
}
#header ul {
	padding: 17px 0 0 0;
	width: 1033px;
	overflow: hidden;
	float: left;
}
#header ul li {
	width: 143px;
	height: 83px;
	float: left;
	border-right: 1px solid #dfdfdf;
}
#header ul li img {
	display: none;
}
#header ul li a {
	display: block;
	width: 143px;
	height: 83px;
}
#header ul li#nav_bt01 {
	width: 168px;
	background: url(/common/images/nav-logo-pc.png) center top no-repeat;
}
#header ul li#nav_bt02 {
	background: url(/common/images/nav-bt01-off-pc.png) center top no-repeat;
}
#header ul li#nav_bt03 {
	background: url(/common/images/nav-bt02-off-pc.png) center top no-repeat;
}
#header ul li#nav_bt04 {
	background: url(/common/images/nav-bt03-off-pc.png) center top no-repeat;
}
#header ul li#nav_bt05 {
	background: url(/common/images/nav-bt04-off-pc.png) center top no-repeat;
}
#header ul li#nav_bt06 {
	background: url(/common/images/nav-bt05-off-pc.png) center top no-repeat;
}
#header ul li#nav_bt07 {
	background: url(/common/images/nav-bt06-off-pc.png) center top no-repeat;
}

#header ul li#nav_bt02:hover, #header ul li#nav_bt02.cr {
	background: url(/common/images/nav-bt01-on-pc.png) center top no-repeat;
}
#header ul li#nav_bt03:hover, #header ul li.cr#nav_bt03 {
	background: url(/common/images/nav-bt02-on-pc.png) center top no-repeat;
}
#header ul li#nav_bt04:hover, #header ul li.cr#nav_bt04 {
	background: url(/common/images/nav-bt03-on-pc.png) center top no-repeat;
}
#header ul li#nav_bt05:hover, #header ul li.cr#nav_bt05 {
	background: url(/common/images/nav-bt04-on-pc.png) center top no-repeat;
}
#header ul li#nav_bt06:hover, #header ul li.cr#nav_bt06 {
	background: url(/common/images/nav-bt05-on-pc.png) center top no-repeat;
}
#header ul li#nav_bt07:hover, #header ul li#nav_bt07.cr {
	background: url(/common/images/nav-bt06-on-pc.png) center top no-repeat;
}
#header .twitter_button {
	padding: 50px 0 0 10px;
	float: right;
}
#menu {
	display: none;
}

#sp_header {
	display: none;
}


/* -------------------------------------------------- フッター */
#footer {
	height: 103px;
	background: url(/common/images/footer-bg01-pc.png) center bottom repeat-x;
	text-align: center;
}
#footer #footer_nav  {
	display: none;
}

#footer ul#footer_logo {
	padding: 27px 0 5px 0;
}
#footer .twitter_button {
	display: none;
}

#footer small {
	display: block;
	margin: 0 20px;
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	line-height: 1;
}

#pagetop {
	margin: 20px auto 0 auto;
	width: 71px;
	height: 71px;
	position: fixed;
	right: 20px;
	bottom: 50px;
}
#pagetop img {
	width: 100%;
}


/* -------------------------------------------------- ここからスマートフォン */

@media screen and (max-width: 767px) {

html {
	display: block;
	background: url(/images/bg-magic-img01-sp.jpg) center top no-repeat;
}
body {
	display: block;
	overflow: hidden;
	width: auto;
	font-size: 13px;
	line-height: 1.2;
}

#contents {
	background: none;
	width: auto;
}

#main {
	margin: 0 auto;
	padding: 0;
	width: auto;
}

img {
	width: 100%;
}

.box {
	margin: 0 20px 44px 20px;
	width: auto;
	border: 2px solid #b8a050;
	background-color: rgba(255, 255, 243, 0.8);
	background-image: url(/common/images/box-courner-bg01-sp.png), url(/common/images/box-courner-bg02-sp.png), url(/common/images/box-courner-bg03-sp.png), url(/common/images/box-courner-bg04-sp.png); 
	background-position: left top, right top, left bottom, right bottom;
	background-repeat: no-repeat;
	background-size: 22px;
}
.box .inner {
	margin: 3px;
	padding: 22px;
	border: 1px solid #b8a050;
}
.box .center_frame {
	margin: -42px 0 0 0;
	width: auto;
	height: 30px;
	background: url(/common/images/box-frame01-sp.png) center top no-repeat;
	background-size: contain;
}


/* -------------------------------------------------- ヘッダー */

#header {
	display: none;
	position: absolute;
	top: 0;
	margin: 0;
	width: auto;
	width: 100%;
	height: auto;
	z-index: 500;
	background: none;
	border-bottom: 2px solid #b8a050;
}
#header .inner {
	margin: 0 auto;
	padding: 30px 0;
	width: auto;
	width: 100%;
	background-image: url(/common/images/nav-frame01-sp.png), url(/common/images/nav-frame02-sp.png);
	background-position: center 4%, center 97%;
	background-repeat: no-repeat;
	background-size: 90% auto;
	background-color: rgba(255, 255, 255, 0.9);
}

#header ul {
	margin: 0 auto 30px auto;
	width: auto;
	width: 100%;
	float: none;
}
#header ul li {
	display: block;
	margin: 0;
	padding: 0;
	width: auto;
	width: 100%;
	height: auto;
	float: none;
	border: none;
	border-bottom: 1px solid #dfdfdf;
	background: none !important;
	text-align: center;
}
#header ul li a {
	width: 100%;
	height: auto;
}
#header ul li img {
	display: block;
}

#header ul li:first-child {
	display: none;
}




#header .twitter_button {
	display: none;
	padding: 50px 0 0 10px;
	float: right;
}
#menu {
	display: block;
	position: absolute;
	top: 22px;
	right: 10px;
	width: 40px;
	height: 36px;
	z-index: 1001;
	background: url(/common/images/nav-menu-bt01-sp.png) center top no-repeat;
	background-size: contain;
}
#header {
	z-index: 1000 !important;
}
#menu.active {
	background: url(/common/images/nav-close-bt01-sp.png) center top no-repeat;
}

#sp_header {
	padding: 17px 0 0 10px;
	width: auto;
	display: block;
	background-color: rgba(255, 255, 255, 0.9);
	background: url(/common/images/footer-li01-sp.png) left top repeat-x;
}
#sp_header a {
	display: block;
	width: 110px;
}


/* -------------------------------------------------- フッター */
#footer {
	display: block;
	height: auto;
	background: none;
	background-color: rgba(255, 255, 255, 0.9);
	text-align: center;
}
#footer nav {
	background: url(/common/images/footer-li01-sp.png) center top repeat-x;
	display: block;
	padding: 17px 0 0 0;
	width: auto;
}
#footer nav ul#footer_nav {
	display: block;
	overflow: hidden;
	width: auto;
}
#footer nav ul li {
	width: 50%;
	float: left;
}
#footer nav ul li img {
	width: 100%;
}

#footer ul#footer_logo {
	padding: 27px 0 25px 0;
}
#footer ul#footer_logo li {
	margin: 0 auto;
	width: 26%;
}

#footer .twitter_button {
	display: block;
	padding: 20px 0 0 10px;
}

#pagetop {
	display: block;
	position: static;
	margin: 20px auto 0 auto;
	width: 71px;
	height: 71px;
}
#footer small {
	display: block;
	margin: 0 20%;
	padding: 0 0 25px 0;
	width: 60%;
}


}

/* タブレット以上のサイズ */

@media screen and (min-width: 768px) {

html {
	width: 100%;
	min-height: 100%;
	background-color: #fff;
}

body {
	width: 100%;
	min-height: 100%;
	color: #000;
	font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "游ゴシック", YuGothic, sans-serif;
	font-size: 14px;
	line-height: 1.6;
	-webkit-text-size-adjust: 100%;
}
a:link {
	color: #ff6f83;
	text-decoration: none;
}
a:visited {
	color: #ff6f83;
	text-decoration: none;
}
a:hover {
	color: #ff6f83;
	text-decoration: underline;
}
a:active {
	color: #ff6f83;
	text-decoration: underline;
}


/* --------------------------------------------------
-------------------------------------------------- Clearfix */

.cf:before, .cf:after {
	content:"";
	display:table;
}
.cf:after {
	clear:both;
}
.cf {
	*zoom:1;
}


/* -------------------------------------------------- ページ全体 */

#wrapper {
	position: absolute;
	width: 100%;
}

#contents {
	position: relative;
	width: 100%;
	min-height: 600px;
}

#main {
	position: relative;
	margin: 0 auto;
	padding: 40px 0 0 0;
	width: 1200px;
}

/* -------------------------------------------------- ヘッダー */

#header {
	display: block !important;
	background: url(/common/images/header-bg01-pc.png) center top repeat-x;
	overflow: hidden;
	margin: 0 0 9px 0;
	height: 102px;
}
#header .inner {
	display: block;
	margin: 0 auto;
	width:1200px;
}
#header ul {
	padding: 17px 0 0 0;
	width: 1033px;
	overflow: hidden;
	float: left;
}
#header ul li {
	height: 83px;
	float: left;
	border-right: 1px solid #dfdfdf;
}
#header .twitter_button {
	padding: 50px 0 0 10px;
	float: right;
}
#menu {
	display: none;
}

/* -------------------------------------------------- フッター */
#footer {
	height: 140px;
	background: url(/common/images/footer-bg01-pc.png) center top repeat-x;
	text-align: center;
}
#footer nav {
	display: none;
}
#footer ul#footer_logo {
	padding: 27px 0 17px 0;
}
#footer small {
	margin: 0 20px;
}

#footer .twitter_button {
	display: none;
}

#pagetop {
	display: none;
	margin: 20px auto 0 auto;
	width: 71px;
	height: 71px;
	position: fixed;
	right: 20px;
	bottom: 120px;
}
}