@charset "UTF-8";
/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
/*================================================
 *  共通
 ================================================*/
body {
	min-width: 1240px;
	background: #fff;
	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-weight: 500;
	color: #222;
}
header {
	min-width: 1240px;
	width: 1240px;
	margin: 0 auto;
}
.inner {
	min-width: 1000px;
	width: 1000px;
	margin: 0 auto;
}
header {
	position: relative;
}
header > h1 img {
	width: 150px;
}
.noto {
	font-family: 'Noto Serif JP', serif;
}
.line {
	background: linear-gradient(180deg, #fff 0%, #fff 50%, #E5FF99 50%, #E5FF99 100%);
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.container {
	display: flex;
}
.half {
	width: 50%;
}
.widthMax {
	width: 100%;
}
.title_img {
	width: 1240px;
	margin: 0 auto;
}
.clear {
	clear: both;
}
/*================================================
 *  background
 ================================================*/
.bg {
	width: 100%;
	background: #E6EEF8;
}
.bg2 {
	width: 100%;
	background: #EEEEEE;
}
/*================================================
 *  余白
 ================================================*/
.pd1 {
	padding: 1em;
}
.pd3 {
	padding: 3em;
}
.pdtb1 {
	padding: 1em 0;
}
.pdtb2 {
	padding: 2em 0;
}
.pdb1 {
	padding-bottom: 1em;
}
.pdb2 {
	padding-bottom: 2em;
}
.pdb3 {
	padding-bottom: 3em;
}
.pdtb3 {
	padding: 3em 0;
}
.pdt1 {
	padding-top: 1em;
}
.pdt2 {
	padding-top: 2em;
}
.pdt3 {
	padding-top: 3em;
}
.pdr1 {
	padding-right: 1em;
}
.pdl1 {
	padding-left: 1em;
}
.pdlr1 {
	padding: 0 1em;
}
.pdl2 {
	padding-left: 2em;
}
.mgt1 {
	margin-top: 1em;
}
.mgb1 {
	margin-bottom: 1em;
}
.mgb2 {
	margin-bottom: 2em;
}
.lh {
	line-height: 2em;
}
.lh2 {
	line-height: 1.5em;
}
/*================================================
 *  font-size
 ================================================*/
.fs11 {
	font-size: 11px;
}
.fs13 {
	font-size: 13px;
}
.fs14 {
	font-size: 14px;
}
.fs15 {
	font-size: 15px;
}
.fs18 {
	font-size: 18px;
}
.fs20 {
	font-size: 20px;
}
.fs22 {
	font-size: 22px;
}
.fs24 {
	font-size: 24px;
}
.fs30 {
	font-size: 30px;
}
.fwb {
	font-weight: bold;
}
/*================================================
 *  font
 ================================================*/
.red {
	color: #D80000;
}
.blue {
	color: #0659BF;
}
.blue2 {
	color: #0759BF;
}
.fwb {
	font-weight: bold;
}
.fwn {
	font-weight: normal;
}
/*================================================
 *  nav
 ================================================*/
h2 {
	text-align: center;
	padding: 2em 0;
	position: relative;
}
.ichioshi {
	width: 90px;
	height: 80px;
	position: absolute;
	top: 0;
	left: 30%;
}
nav {
	position: absolute;
	bottom: 1em;
	right: 0;
	font-size: 16px;
	z-index: 110;
}
nav a {
	text-decoration: none;
	color: #222;
}
.home i {
	color: #0659BF;
}
#header-nav {
	position: absolute;
	right: 2em;
	bottom: 1em;
	text-align: center;
}

.header-list {
	font-size: 0;
}
.menu-item {
	display: inline-block;
	position: relative;
	padding: 0 10px;
}
.menu-item > a {
	display: block;
	width: 100%;
	font-size: 16px;
	text-align: center;
}
.sub-menu {
	position: absolute;
	background: #fff;
	top: 32px;
	width: 200px;
	font-size: 13px;
}
.sub-menu-item {
	overflow: hidden;
	opacity: 0;
	height: 0;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}
.sub-menu-item {
	text-align: left;

}
.menu-item:hover > .sub-menu > .sub-menu-item {
	overflow: visible;
	opacity: 1;
	height: 4em;
	padding: 1.5em 0 0 0.5em;
	background: url('../images/arrow.png') no-repeat;
	background-position: 95% 50%;
}
.sub-menu-item i {
	overflow: visible;
	position: absolute;
}
.menu-item > a:hover,
.sub-menu-item > a:hover {
	cursor: pointer;
	background: linear-gradient(180deg, #fff 0%, #fff 50%, #E5FF99 50%, #E5FF99 100%);
}
/*================================================
 *  sp_nav
 ================================================*/
#nav-drawer {
	display: none;
	position: absolute;
	right: 10px;
	top: 10px;
}
#splogo,
#spmenu,
.nav-unshown {
	display:none;
}
#splogo {
	padding-top: 10px;
}
#splogo img {
	width: 140px;
}
#spmenu {
	position: absolute;
	right: 70px;
	top: 10px;
}
#spmenu > ul > li {
	display: inline-block;
}
#nav-open img,
#spmenu > ul > li img {
	width: 50px;
}
#nav-close {
	display: none;
	position: fixed;
	z-index: 130;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: black;
	opacity: 0;
	transition: .3s ease-in-out;
}
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 90%;
	max-width: 330px;
	height: 100%;
	background: #fff;
	transition: .3s ease-in-out;
	-webkit-transform: translateX(-105%);
	transform: translateX(-105%);
}
#nav-content > ul {
	text-align: center;
	margin: auto 40px;
}
#nav-content > ul > li a {
	text-decoration: none;
	color: #222;
	display: block;
}

#nav-content > ul > li > a {
	padding: 15px;
}
#nav-content > ul > li > ul > li {
	font-size: 13px;
	text-align: left;
	border-bottom: 1px solid #ddd;
	background: url('../images/arrow.png') no-repeat;
	background-position: 95% 50%;
}
#nav-content > ul > li > ul > li a {
	padding: 10px;
}
#nav-input:checked ~ #nav-close {
	display: block;
	opacity: .5;
}
#nav-input:checked ~ #nav-content {
	-webkit-transform: translateX(0%);
	transform: translateX(0%);
	box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
/*================================================
 *  follow_us
 ================================================*/
.follow_us {
	position: fixed;
	right: 0;
	top: 50%;
}
/*================================================
 *  slide
 ================================================*/
#slick {
	position: relative;
	z-index: 100;
	padding-top: 1em;
}
.slideshow > div {
	min-width: 960px;
}
.slideshow img {
	width: 95%;
	max-height: 750px;
	height: 70vh;
	object-fit: cover;
	border-radius: 10px;
	margin: 0 auto;
}
.slick-dots li button:before{
	color: #0659BF;
	opacity: 0.8;
}
.slick-dots li.slick-active button:before{
	content: url("../images/dot.png");
}
.menuicon {
	display: none;
}
.menuicon > ul {
	display: table;
	width: 100%;
}
.menuicon > ul > li {
	display: table-cell;
	width: 33.3%;
	padding: 5px;
}
.menuicon > ul > li img {
	width: 100%;
}
/*================================================
 *  recommend
 ================================================*/
.bg {
	width: 100%;
	background: #E6EEF8;
}
.slick-box .slick-prev,
.slick-box .slick-next {
	z-index: 120;
	width: 58px;
	height: 77px;
	top: 200px;
}

.slick-box .slick-prev::before {
	content: url(../images/prev.png);
}
.slick-box .slick-next::before {
	content: url(../images/next.png);
}
.item_info {
	margin: 1em auto;
	width: 260px;
	text-align: center;
}
.item_img {
	margin: 0 auto;
	width: 260px;
	height: 346px;
	background: #fff;
	position: relative;
	text-align: center;
	z-index: 110;
	box-sizing: border-box;
	border-radius: 15px;
	box-shadow: 0 0 0 12px #fff;
}
.item_img > img {
	max-width: 260px;
	max-height: 346px;
	position: absolute;
	z-index: 100;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}
.item_icon {
	position: relative;
	height: 40px;
}
.item_limited,
.item_new {
	position: absolute;
	top: 0;
	z-index: 120;
}
.item_new {
	left: 0;
}
.item_limited {
	left: 60px;
}
.item_info > span {
	display: block;
	line-height: 1.5em;
}
.item_text,
.item_brand {
	font-size: 13px;
}
.item_brand {
	font-size: 13px;
}
.item_title {
	color: #0659BF;
	padding: 5px 0;
}
/*================================================
 *  info
 ================================================*/
.info {
	font-size: 15px;
	overflow-y: scroll;
	height: 320px;
}
.info a {
	color: #0659BF;
}
.info > dl {
	border-collapse: collapse;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 1em;
}
.info dl + dl {
	border-top:none;
}
.info > dl > dt {
	float: left;
	width: 130px;
}
.info > dl > dt > i {
	color: #0659BF;
	width: 10px;
}
.info > dl > dt > span {
	display: block;
	padding-left: 10px;
	padding-top: 0.5em;
}
.info > dl > dd {
	margin-left: 130px;
	line-height: 1.5em;
}
.facebook-wrapper {
    max-width: 460px;
    margin: 0 auto;
}

.facebook-wrapper > .fb-page {
    width: 100%;
}

.facebook-wrapper > .fb-page > span,
.facebook-wrapper iframe {
    width: 100% !important;
}
/*================================================
 *  top
 ================================================*/
.top_icon > ul {
	display: table;
	width: 432px;
	margin: 0 auto;;
}
.top_icon > ul > li {
	display: table-cell;
	text-align: center;
	width: 144px;
	padding: 0.5em;
}
.top_icon_sp {
	display: none;
	margin: 1em 0;
}
.top_icon_sp > ul {
	display: table;
	width: 100%;
}
.top_icon_sp > ul > li {
	display: table-cell;
	text-align: center;
	width: 50%;
	padding: 0.5em;
}
.top_icon_sp > ul > li img {
	width: 100%;
}
.title_img {
	background: url(../images/titlebg.png) no-repeat;
	height: 280px;
	width: 1240px;
	margin-bottom: 100px;
	margin-top: 1em;
}
.title_img > h2 {
	margin-top: 80px;
}
/*================================================
 *  footer
 ================================================*/
.s1 {
	color: #111;
	font-size: 18px;
	display: flex;
	align-items: center;
	margin-bottom: 2em;
}
.s1:before, .s1:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	background: #ddd;
	display: block;
}
.s1:before {
	margin-right: 1em;
}
.s1:after {
	margin-left: 1em;
}
.s2 {
	color: #444;
	font-size: 24px;
	display: flex;
	align-items: center;
	text-align: center;
	line-height: 1.5em;
}
.s2:before, .s2:after {
	content: "";
	flex-grow: 1;
	border-top: 4px dotted #0659BF;
	display: block;
	opacity: 0.5;
}
.s2:before {
	margin-right: .4em;
}
.s2:after {
	margin-left: .4em;
}
footer > .inner {
	position: relative;
}
.totop {
	position: absolute;
	bottom: 0;
	right: 0;
}
.ggmap {
	margin-left: 1.5em;
}
.sns img {
	width: 40px;
}
/*================================================
 *  decorte
 ================================================*/
.box1 {
	width: 768px;
	margin: 50px auto;
	padding: 1em;
	box-sizing: border-box;
	color: #000;
	background: #fff;
	border: 0;
	border-radius: 15px;
	box-shadow: 0 0 0 12px #fff;
}
.box1 img {
	max-width: 360px;
}
.box1 > .container > div {
	width: 360px;
}
.box2 > .red,
.box2 > .container > div > .red,
.box1 > .container > div > .red {
	font-weight: normal;
}
.box2 {
	margin: 15px;
	box-sizing: border-box;
	text-align: center;
	color: #000;
	background: rgba(255, 255, 255, 0.10);
	border: 1px dashed #0659bf;
	border-radius: 15px;
	box-shadow: 0 0 0 12px rgba(255, 255, 255, 0.10);
}
.course_title1 {
	color: #0659BF;
	font-size: 24px;
	background: linear-gradient(180deg, #fff 0%, #fff 70%, #E5FF99 30%, #E5FF99 100%);
}
.course_title2 {
	color: #0659BF;
	display: block;
	line-height: 2em;
	background: none;
	font-size: 15px;
}
.standard {
	margin-top: -100px;
	margin-left: -66px;
}
/*================================================
 *  original
 ================================================*/
.left {
	display: inline-block;
	vertical-align: top;
}
.right {
	vertical-align: top;
	display: inline-block;
	padding-left: 1em;
}
.original_bottom,
.original2,
.original {
	position: relative;
	margin: 0 auto;
	width: 768px;
	height: auto;
	box-sizing: border-box;
	border: 0;
}
.original2,
.original {
	border-radius: 15px 15px 0 0;
	background: #fff;
	box-shadow: 0 0 0 12px #fff;
}
.original {
	padding: 1em;
}
.original2{
	border-radius: 15px;
}
.butachan {
	position: absolute;
	top: -140px;
	left: -80px;
}
.original_bottom2,
.original_bottom {
	border-radius: 0 0 15px 15px;
	background: #B4CDEC;
	box-shadow: 0 0 0 12px #B4CDEC;
	margin-bottom: 3em;
}
.original_bottom {
	display: flex;
	align-items: center;
	justify-content: center;
}
.original_bottom2 > div {
	width: 480px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.original2 {
	position: relative;
}
.hamidasu_txt {
	width: 480px;
	height: 200px;
}
.hamidasu_img img {
	position: absolute;
	right: 1em;
	top: 1em;
	z-index: 120;
}
/*================================================
 *  staff
 ================================================*/
.ogaya {
	position: relative;
}
.message {
	position: absolute;
	right: -20px;
	top: -20px;
}
/*================================================
 *  voice
 ================================================*/
 .voice {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.voice img {
	width: 100%;
	height: auto;
}
.voice>li {
	width: 30%;
}
.voice dl {
	padding-bottom: 1em;
}
.voice-slide {
	width: 100%;
}
/*================================================
 *  mboile
 ================================================*/

@media screen and (max-width: 480px) {
	body {
		min-width: 375px;
		width: 100%;
	}
	.slick-box{
		width: 100%;
	}
	header,
	.inner {
		min-width: 100%;
		width: 100%;
		margin: 0 auto;
	}
	.top_icon,
	header > h1 {
		display: none;
	}
	.top_icon_sp,
	.menuicon,
	#spmenu,
	#splogo,
	.container {
		display: block;
	}
	.half {
		width: 100%;
	}
	#header-nav {
		display: none;
	}
	#nav-drawer {
		display: block;
	}
	.ichioshi {
		left: 0;
	}
	.facebook-wrapper {
		margin: 1em 0;
	}
	.slick-prev {
		left: 0;
	}
	.slick-next {
		right: 0;
	}
	.totop {
		display: none;
	}
	.ggmap {
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 30px;
		height: 0;
		overflow: hidden;
		margin: 0;
	}
	.ggmap iframe,
	.ggmap object,
	.ggmap embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.title_img {
		margin-top: 1em;
		width: 100%;
		height: 200px;
		background-position: center;
	}
	.title_img > h2 {
		margin-top: 0;
	}
	.box2,
	.box1 {
		width: 100%;
		text-align: center;
	}
	.box2 {
		margin: 1em 0;
	}
	.ogaya img,
	h2 img,
	h3 img,
	.box1 img,
	.box2 img {
		max-width: 300px;
	}
	.standard {
		margin: 0;
	}
	.original_bottom2 > div,
	.box1 > .container > div {
		width: 100%;
	}
	.info > dl > dt {
		float: none;
		width: 100%;
		margin: 0;
		padding: 0;
		line-height: 2em;
	}
	.info > dl > dd {
		margin-left: 0;
	}
	.info > dl > dt > span {
		display: inline;
		margin: 0;
		padding: 0;
	}
	.message {
		top: 0;
		right: 0;
	}
	.message img {
		width: 120px;
	}
	.hamidasu_txt,
	.original2,
	.original_bottom {
		width: 100%;
	}
	.original {
		width: 100%;
		display: block;
	}
	.butachan {
		position: static;
		top: 0;
		left: 0;
	}
	.butachan img {
		width: 200px;
	}
	.right {
		padding: 0;
	}
	.hamidasu_txt {
		height: auto;
	}
	.hamidasu_img img {
		position: static;
		right: 0;
		top: 0;
		padding-bottom: 2em;
	}
	.voice {
		display: block;
	}
	.voice>li {
		width: 100%;
	}
	.follow_us {
		display: none;
	}
	.slideshow > div {
		min-width: 100%;
	}
	.slideshow img {
		height: 160px;
	}
}