@charset "UTF-8";
* {
	color: inherit;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ　Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 1em;
	-webkit-font-smoothing: antialiased
}
.roboto {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500
}
.serif {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ　Ｐ明朝", "MS PMincho", sans-serif
}
.schoolbook {
	font-family: 'CenturySchoolbookBT-Roman', serif !important
}
a {
	text-decoration: none
}
a:hover, a:active, a:focus {
	color: inherit
}
.cf:after {
	content: ' ';
	display: block;
	clear: both
}
.arrow-top:after, .arrow-left:after, .arrow-right:after, .arrow-bottom:after {
	content: ' ';
	display: block;
	z-index: 1;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 0;
	height: 0;
	margin: auto;
	border: 8px solid transparent
}
.arrow-top:after {
	top: -15px;
	bottom: auto;
	border-bottom: 8px solid #FFF
}
.arrow-left:after {
	left: -15px;
	right: auto;
	border-right: 8px solid #FFF
}
.arrow-right:after {
	left: auto;
	right: -15px;
	border-left: 8px solid #FFF
}
.arrow-bottom:after {
	top: auto;
	bottom: -15px;
	border-top: 8px solid #FFF
}
.cssanimations {/*!
  Animate.css - //daneden.me/animate
	Licensed under the MIT license - //opensource.org/licenses/MIT

  Copyright (c) 2015 Daniel Eden
  */
}
@-webkit-keyframes bounce {
0, 20%, 53% {
-webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
40%, 43% {
-webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
}
@keyframes bounce {
0, 20%, 53% {
-webkit-animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
40%, 43% {
-webkit-animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function:cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
}
.cssanimations .bounce.on {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: bounce;
	animation-name: bounce;
	-webkit-transform-origin: center bottom;
	transform-origin: center bottom
}
@-webkit-keyframes float_up {
0, 96% {
opacity:0;
-webkit-transform:translateY(10px);
-moz-transform:translateY(10px);
-ms-transform:translateY(10px);
-o-transform:translateY(10px);
transform:translateY(10px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes float_up {
0, 96% {
opacity:0;
-webkit-transform:translateY(10px);
-moz-transform:translateY(10px);
-ms-transform:translateY(10px);
-o-transform:translateY(10px);
transform:translateY(10px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
}
.mo_op60, .mo_op65 {
	-webkit-transition: opacity .16s ease-in;
	-moz-transition: opacity .16s ease-in;
	-ms-transition: opacity .16s ease-in;
	-o-transition: opacity .16s ease-in;
	transition: opacity .16s ease-in
}
.mo_op60:hover {
	opacity: .65
}
.mo_op65:hover {
	opacity: .65
}
.mo_ul:hover {
	text-decoration: underline
}
.mo_black {
	-webkit-transition: color .16s ease-in;
	-moz-transition: color .16s ease-in;
	-ms-transition: color .16s ease-in;
	-o-transition: color .16s ease-in;
	transition: color .16s ease-in
}
.mo_black>span {
	-webkit-transition: color .16s ease-in;
	-moz-transition: color .16s ease-in;
	-ms-transition: color .16s ease-in;
	-o-transition: color .16s ease-in;
	transition: color .16s ease-in
}
.mo_black:hover {
	color: #545454 !important
}
.home .mo_black:hover span {
	color: #000 !important
}
.book .mo_black:hover span {
	color: #454545 !important
}
@-webkit-keyframes mo_flash {
0, 100% {
opacity:1
}
30%, 60% {
opacity:.7
}
}
@keyframes mo_flash {
0, 100% {
opacity:1
}
30%, 60% {
opacity:.7
}
}
.cssanimations .mo_flash:hover {
	-webkit-animation-duration: 1.18s;
	animation-duration: 1.18s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: mo_flash;
	animation-name: mo_flash
}
@-webkit-keyframes slide_up {
0 {
opacity:0;
-webkit-transform:translateY(35%);
-moz-transform:translateY(35%);
-ms-transform:translateY(35%);
-o-transform:translateY(35%);
transform:translateY(35%)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes slide_up {
0 {
opacity:0;
-webkit-transform:translateY(35%);
-moz-transform:translateY(35%);
-ms-transform:translateY(35%);
-o-transform:translateY(35%);
transform:translateY(35%)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
}
.cssanimations .slide_up {
	opacity: 0;
	-webkit-transform: translateY(35%);
	-moz-transform: translateY(35%);
	-ms-transform: translateY(35%);
	-o-transform: translateY(35%);
	transform: translateY(35%);
	-webkit-animation-duration: .72s;
	animation-duration: .72s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: slide_up;
	animation-name: slide_up;
	-webkit-animation-delay: .4s;
	animation-delay: .4s
}
@-webkit-keyframes fade_in {
0 {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fade_in {
0 {
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes float_up_down {
0 {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
50% {
-webkit-transform:translateY(6px);
-moz-transform:translateY(6px);
-ms-transform:translateY(6px);
-o-transform:translateY(6px);
transform:translateY(6px)
}
100% {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes float_up_down {
0 {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
50% {
-webkit-transform:translateY(6px);
-moz-transform:translateY(6px);
-ms-transform:translateY(6px);
-o-transform:translateY(6px);
transform:translateY(6px)
}
100% {
-webkit-transform:translateY(0);
-moz-transform:translateY(0);
-ms-transform:translateY(0);
-o-transform:translateY(0);
transform:translateY(0)
}
}
.cssanimations .float_up_down {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	-o-transform: translateY(0);
	transform: translateY(0);
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: .4s;
	animation-delay: .4s;
	-webkit-animation-name: float_up_down;
	animation-name: float_up_down;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}
@font-face {
	font-family: 'icomoon';
	src: url('../fonts/icomoon-1rz8f1.eot');
	src: url('../fonts/icomoon-1rz8f1.eot#iefix') format('embedded-opentype'), url('../fonts/icomoon-1rz8f1.ttf') format('truetype'), url('../fonts/icomoon-1rz8f1.woff') format('woff'), url('../fonts/icomoon-1rz8f1.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
font-family: 'icomoon';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-share_gp:before {
	content: "\e605";
}
.icon-share_fb:before {
	content: "\e604";
}
.icon-share_pi:before {
	content: "\e608";
}
.icon-share_tw:before {
	content: "\e609";
}
.icon-ec:before {
	content: "\e600";
}
.icon-fb:before {
	content: "\e601";
}
.icon-haluta:before {
	content: "\e602";
}
.icon-insta:before {
	content: "\e603";
}
.icon-webbook:before {
	content: "\e60d";
}
.icon-tw:before {
	content: "\ea91";
}
html, body {
	font-size: 14px;
	
}
.sp {
	display: none !important
}
.wrapper {
	min-width: 960px;
	max-width: 1600px;
	margin: auto
}
.page_title {
	margin-bottom: 8px;
	font-size: 50px;
	text-align: center
}
.page_sub {
	font-size: 12px;
	text-align: center
}
.block_title {
	margin-bottom: 36px;
	font-size: 24px;
	text-align: center
}
.block_title .underline {
	padding-bottom: 2px;
	border-bottom: 1px solid #000
}
.column_text {
	width: 480px;
	margin: auto;
	color: #545454;
	line-height: 1.8em;
	-webkit-columns: 2 228px;
	-moz-columns: 2 228px;
	columns: 2 228px
}
@media screen and (max-width:1199px) {
.column_text {
	width: 420px;
	-webkit-columns: 1;
	-moz-columns: 1;
	columns: 1
}
}
#gHeader {
	min-width: 960px;
	width: 100%;
	height: 42px;
	background-color: #f6f4e8
}
#gHeader ul, #gHeader li, #gHeader p, #gHeader a, #gHeader span {
	display: inline-block;
	color: #909090;
	font-size: 12px;
	line-height: 42px;
	letter-spacing: .02em
}
#gHeader .gHeader01 {
	margin-left:30px;
	font-size:14px;
	font-weight:bold;
}
#gHeader .gHeader01 span {
	font-size:14px;
	font-weight:bold;
	text-decoration:underline;
}
#gHeader .gHeader02 {
	margin-left:30px;
	font-size: 12px;
	font-weight:bold;
}

#gNav {
	min-width: 960px;
	padding: 48px 0 36px
}
#gNav .logo {
	width: 188px;
	margin: 0 auto 28px
}
#gNav .logo img {
	display: block;
	width: 100%;
	height: 100%
}
#gNav ul {
	text-align: center;
	font-size: 0
}
#gNav li {
	display: inline-block;
*display:inline;
	width: 126px;
	height: 14px;
	border-right: 1px solid #000
}
#gNav li:first-child {
	border-left: 1px solid #000
}
#gNav li a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	color: #000;
	font-size: 24px;
	line-height: 14px;
	vertical-align: middle
}
#gNav li span {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	color: #FFF;
	font-size: 18px;
	line-height: 14px;
	vertical-align: middle
}
.footer_sns_link {
	min-width: 960px;
	margin: 40px 0
}
.footer_sns_link>div {
	display: inline-block;
	line-height: 20px;
	vertical-align: middle
}
.footer_sns_link>div .ico {
	display: inline;
	margin-right: 6px;
	color: #8f8f8f;
	font-size: 15px;
	vertical-align: middle
}
.footer_sns_link>div a, .footer_sns_link>div span {
	color: #8f8f8f;
	font-size: 12px;
	vertical-align: middle
}
.footer_sns_link .fb {
	margin-left: 28px
}
.footer_sns_link .insta {
	margin-left: 20px
}
.footer_sns_link .tw {
	margin-left: 20px;
}
.footer_sns_link .fb-like {
	float: right;
	margin-right: 28px;
	width: 80px;
	line-height: 20px;
	vertical-align: middle
}
#gFooter {
	min-width: 960px;
	padding: 34px 0;
	background-color: #f1f1f1;
	color: #333
}
#gFooter .ico {
	margin: 0 auto 30px;
	text-align: center
}
#gFooter .ico>a {
	color: #333;
	font-size: 20px;
	text-align: center
}
#gFooter ul {
	margin-bottom: 24px;
	font-size: 0;
	text-align: center
}
#gFooter li {
	display: inline-block;
	margin: 0 8px
}
#gFooter li a {
	font-size: 12px;
	font-weight: bold
}
#gFooter .copyright {
	font-size: 11px;
	text-align: center
}
#pagetop_btn {
	z-index: 10;
	position: fixed;
	right: 26px;
	bottom: -50px;
	width: 50px;
	height: 50px;
	-webkit-transition: bottom .24s cubic-bezier(0.7, 0, 0.3, 1);
	-moz-transition: bottom .24s cubic-bezier(0.7, 0, 0.3, 1);
	-ms-transition: bottom .24s cubic-bezier(0.7, 0, 0.3, 1);
	-o-transition: bottom .24s cubic-bezier(0.7, 0, 0.3, 1);
	transition: bottom .24s cubic-bezier(0.7, 0, 0.3, 1)
}
#pagetop_btn.show {
	bottom: 26px
}
#pagetop_btn>a {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #f1f1f1
}
@media screen and (max-width:640px) {
* {
	font-size: inherit
}
html, body {
	font-size: 12px
}
.pc {
	display: none !important
}
.sp {
	display: block !important
}
.wrapper {
	min-width: 320px;
	max-width: 640px;
	width: 100%
}
.page_title {
	margin-bottom: 8px;
	font-size: 32px
}
.page_sub {
	font-size: 10px
}
.block_title {
	margin-bottom: 28px;
	font-size: 20px
}
.block_title .underline {
	padding-bottom: 6px;
	border-bottom: 1px solid #000
}
.column_text {
	width: 87.5%;
	-webkit-columns: 1;
	-moz-columns: 1;
	columns: 1
}
#gNav {
	min-width: 320px;
	padding: 22px 0 24px
}
#gNav .logo {
	width: 121px;
	height: 58px;
	margin-bottom: 0
}
#spMenu_btn {
	z-index: 20;
	position: fixed;
	top: 34px;
	width: 100%;
	height: 0
}
#spMenu_btn .btn {
	position: relative;
	width: 41px;
	height: 41px;
	margin-left: 6.25%
}
#spMenu_btn .btn>a {
	display: block;
	width: 100%;
	height: 100%;
	background-color:#FEFCF7;
}
#spMenu_btn .border {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 1;
	width: 20px;
	height: 0;
	margin: auto;
	border-top: 2px solid #000
}
#spMenu_btn .n1 {
	top: 15px
}
#spMenu_btn .n2 {
	top: 20px
}
#spMenu_btn .n3 {
	top: 25px
}
#spMenu {
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
	z-index: 100;
	position: fixed;
	top: 0;
	left: 0;
	width: 75%;
	height: 100%;
	background-color: #FFF;
	-webkit-transform: translate(-100%, 0);
	-moz-transform: translate(-100%, 0);
	-ms-transform: translate(-100%, 0);
	-o-transform: translate(-100%, 0);
	transform: translate(-100%, 0)
}
#spMenu .header {
	padding: 22px 0 24px;
	border-bottom: 1px solid #EEE
}
#spMenu .header .logo {
	width: 121px;
	height: 58px;
	margin: 0 auto
}
#spMenu .header .logo img {
	display: block;
	width: 100%;
	height: 100%
}
#spMenu .nav>li, #spMenu .link ul>li {
	height: 44px;
	margin-left: 20px;
	padding: 0 12px
}
#spMenu .nav>li>a, #spMenu .link ul>li>a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	font-size: 16px;
	line-height: 44px
}
#spMenu .nav>li>a {
	font-size:20px;
	color:#fff;
}
#spMenu .nav>li>a:after, #spMenu .link ul>li>a:after {
	content: ' ';
	display: block;
	position: absolute;
	top: 0;
	right: 18px;
	bottom: 0;
	width: 6px;
	height: 6px;
	margin: auto;
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg)
}
#spMenu .nav {
	padding: 16px 0 14px;
	background-color:#678171;
}
#spMenu .ico {
	margin-right: 9px;
	font-size: 10px
}
#spMenu .title {
	margin-bottom: 12px;
	padding: 0 12px;
	font-size: 12px
}
#spMenu .link {
	background-color: #EEE
}
#spMenu .link>div {
	padding: 16px 0 14px;
	border-top: 1px solid #dedede
}
#spMenu .link>div:first-child {
	border-top: 0
}
#spMenu .link>div.webbook {
	padding: 16px 0 14px
}
#spMenu .link>div.webbook>p {
	height: 44px;
	margin-bottom: 0;
	padding: 0 12px
}
#spMenu .link>div.webbook>p>a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	font-size: 16px;
	line-height: 44px
}
#spMenu .link>div.webbook>p>a:after {
	content: ' ';
	display: block;
	position: absolute;
	top: 0;
	right: 18px;
	bottom: 0;
	width: 6px;
	height: 6px;
	margin: auto;
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg)
}
#spMenu .btn {
	padding: 16px 0 28px;
	height: 20px
}
#spMenu .btn .fb-like {
	margin-left: 12px;
	line-height: 20px;
	vertical-align: top
}
#spMenu .spnavbtm {
}
#spMenu_btn, #spMenu, #page_content, body>.overlay {
	-webkit-transition: all .26s ease-in-out;
	-moz-transition: all .26s ease-in-out;
	-ms-transition: all .26s ease-in-out;
	-o-transition: all .26s ease-in-out;
	transition: all .26s ease-in-out
}
body>.overlay {
	content: ' ';
	z-index: 90;
	opacity: 0;
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: auto;
	background-color: #000
}
.page_wrap {
	position: relative;
	width: 100%;
	overflow: hidden
}
.open {
	overflow: hidden
}
.open>.overlay {
	opacity: .5
}
.open #spMenu {
	-webkit-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0)
}
.open #spMenu_btn, .open #page_content {
	-webkit-transform: translate(75%, 0);
	-moz-transform: translate(75%, 0);
	-ms-transform: translate(75%, 0);
	-o-transform: translate(75%, 0);
	transform: translate(75%, 0)
}
#gFooter {
	min-width: 320px;
	padding: 24px 0 0;
	background-color: #EEE;
	color: #000
}
#gFooter .ico {
	margin: 0 auto 24px
}
#gFooter .ico>a {
	font-size: 11px
}
#gFooter ul {
	margin-bottom: 36px
}
#gFooter li {
	display: block;
	margin: 0 0 20px
}
#gFooter li a {
	font-size: 11px;
	font-weight: normal
}
#gFooter .copyright {
	margin-bottom: 32px;
	color: #666;
	font-size: 11px
}
#gFooter .pagetop {
	width: 100%;
	height: 44px;
	background-color: #dedede
}
#gFooter .pagetop>a {
	display: block;
	position: relative;
	width: 100%;
	height: 100%
}
#gFooter .pagetop>a:before, #gFooter .pagetop>a:after {
	content: ' ';
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto
}
#gFooter .pagetop>a:before {
	top: -5px;
	width: 8px;
	height: 0;
	border-top: 1px solid #333
}
#gFooter .pagetop>a:after {
	top: 7px;
	width: 5px;
	height: 5px;
	border-top: 1px solid #333;
	border-left: 1px solid #333;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg)
}
}
