@charset "utf-8";
* { box-sizing:border-box; }
html { font-size:15px; overflow:auto; -webkit-text-size-adjust:100%; }
body, h1, h2, h3, dl, dd, ul, form, textarea  {
  margin:0; padding:0; font-size:100%; font-weight:normal;
  line-height:1.6;
}
body {
	color:#000; font-size:15px;
	font-family:"游ゴシック", "Yu Gothic", YuGothic, "メイリオ", "Meiryo","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
}

img { font-size:0; line-height:0; vertical-align:bottom; max-width:100%; }
ul { list-style-type:none; }
fieldset { border:none; }
strong { margin: 0 2px; line-height: 1.8; }
em { font-style:normal; font-weight:bold; }
label { display:inline-block; }
table { border-collapse:collapse; border-spacing:0; }
figure { margin:0; }

article, aside, dialog, figure, footer, header, hgroup, nav, section { display:block; }

input[type="text"], input[type="email"], textarea, textarea.required { border-radius:3px; padding:4px 8px; }
select { padding:3px 8px 6px; }
textarea { width:100%; box-sizing:border-box; }
input[type="submit"], input[type="button"]  { cursor:pointer; }
input[type="text"], textarea, select { margin:3px 0; }
select[name="date"] { margin-right:20px; }

input.t { width:15%; }
input.s { width:30%; }
input.m { width:60%; }
input.l { width:96%; }
textarea { width:96%; }
label input { margin:0; }

input.img_file { margin-bottom:5px; }
article, aside, dialog, figure, footer, header, hgroup, nav, section { display:block; }

/*回り込み解除clearfix*/
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */

/* 共通 ------------------------ */
a { color:#000; }
@media screen and (min-width: 1079px) {
  a:not(.fade) { -webkit-transition: all .3s; transition: all .3s; }
  a:active, a:hover { color:#8A8A8A; }
  a:hover{ text-decoration: none; }
}
a img, img { border-width:0px; }
map area:focus, map area:active { outline:none; border:0; }
.serif {
	font-family: 
		"游明朝体", "Yu Mincho", YuMincho, 
		"ヒラギノ明朝 ProN W6", "HiraMinProN-W6", 
		"HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; }

.font_en, .sidr-class-font_en { font-family: 'Oswald', sans-serif; font-style: italic; }
.font_os { font-family: 'Oswald', sans-serif;}
.left   { text-align:left; }
.center { text-align:center; }
.right  { text-align:right; }
.small  { font-size:0.85em; }
.bold { font-weight:bold; }
.clear { clear:both; }
.hide { display:none; }
.iblock { display:inline-block; }
.wide { width:100%; }
.pc_none { display:none; }
.red    { color:#bf1920; }

.marker_yellow { background: linear-gradient(transparent 60%, #f6c725 60%); }

ul.disc, ul.square { margin-left:1.3em; }
.disc li { list-style-type:disc; }
.square li { list-style-type:square; }
.decimal li { list-style-type:decimal; }

img.middle { vertical-align:middle; }
.indent{ text-indent: -1em; padding-left: 1em; }

.fleft { float:left; }
.fright { float:right; }

.shadow { box-shadow: 0 0 3px rgba(0,0,0,0.3); }

.flex {	display: -webkit-flex; display: flex;
 -webkit-flex-wrap: wrap; flex-wrap:wrap; }
.between { justify-content:space-between; -webkit-justify-content:space-between; }

@media screen {
  .fw { margin-left:-500%; margin-right:-500%; padding-left:500%; padding-right:500%; /*Full Width*/ }
}

/* base------------------------ */
#contents { max-width:1080px; width:100%; margin:0 auto; }
#wrapper { width:100%; overflow:hidden; }
#pan { margin:20px auto 40px; }
#pan li { display:inline-block; font-size:14px; }
#pan li:not(:first-child):before { content:">"; padding:0 5px; color:#888; }
.btn { margin: 35px 0 0; }
.btn a {
	display:inline-block; padding:10px 70px 8px; text-align:center;
	text-decoration:none; font-size:16px; position: relative;
	background:#f6c725;}
.btn a:hover { color: #000; background: #e5b100; }
.btn a::after { content: url(../img/arrow.png); position: absolute; right: 14px; top: 10px;}
.btn a:hover::after { right: 10px; }

br.sp { display:none; }

.studio_data dt {
  width: 15%; padding: 2px 6px; text-align: center; float: left;
  clear: left; font-size: 13px; font-family: 'Oswald', sans-serif; border: 1px solid;
}
.studio_data dd { width: 85%; padding: 0 0 12px 18%; }



/* pagination ------------------------ */
.pagination { text-align:center; }
.pagination span.disabled { display:none; }
.pagination span.current { color:#fff; background-color:#7d7d7d; }
.pagination span { padding:5px 10px; margin-right:2px; border:1px solid #7d7d7d; }
.pagination a {
	padding:5px 10px; margin-right:2px; text-decoration:none; border:1px solid #7d7d7d;
}
/* header------------------------ */
header {
  position:relative; margin: 0 auto;
  background: url(../img/main_bg.jpg) no-repeat left top #fff;
}
header .inner {
	position:relative; width:1080px; margin:0 auto; padding:56px 0 50px;
}
header #hlogo { display: block; width: 300px; margin: 0 20px 0 0; float: left; }
header h1 {
  padding-top: 4px; float:left; font-weight:normal; font-size: 14px;
}
header .sub {
	width:1080px; margin-left:-540px; position:absolute; top:34px;
  left:50%; overflow:hidden; clear:both;
}
header .sub .box {
  justify-content: flex-end; -webkit-justify-content: flex-end;
  margin-bottom: 10px;
}
header .sns_icon { float:right; }
.sns_icon li { float:left; width:26px; margin-left:7px; }
.snav { margin-left:50px; float:right; }
.snav li { float:left; margin-left:15px; }
.snav li a { text-decoration:none; }
header .tel {
  margin: 0 15px 0 0; font-size: 26px; font-style: normal; color: #311f08; line-height: 100%;
}
header .tel span {
  display: inline-block; padding: 2px 8px; margin: 5px 8px;
  border: 1px solid; font-size: 13px; line-height: 100%;
}
header .hbox {
	width:1080px; margin-left:-540px; position:absolute; top:600px;
  left:50%; overflow:hidden; clear:both;
}
header .con_box {
  width: 280px; margin-bottom: 48px; padding: 10px 24px;
  text-align: center; background: #f6c725; font-weight: bold;
  position: relative; z-index: 200;
}
header .con_box .btn { margin: 10px 0; }
header .con_box a { font-weight: normal; border:2px solid; }
header #lang { position: relative; z-index: 210; }
header #lang a {
  display: inline-block; text-decoration: none;
  padding: 10px 17px; margin: 0 5px; border: 2px solid #000;
  font-style: normal; font-size: 18px; background: #fff;
}
header #lang a:hover { border-color: #8a8a8a; }
header #lang a.active { padding: 8px 16px; border-width: 4px; }
#main_area {
  max-width: 1200px; margin: 0 auto; padding-bottom: 30px; position: relative;
}
#main_area .top_ttl {
  position: absolute; right: 20px; bottom:45px; z-index: 100;
}

/* nav------------------------*/
#header .head-nav {
  background: url(../img/gnav_bg.jpg) repeat-x bottom left #311f08;
}
#gnav {
	position:relative; width:100%; margin:0 auto;
	-webkit-justify-content:center; justify-content:center;
}
#gnav li { margin:0 4px; position:relative; }
#gnav li:first-child { margin-left:0; }
#gnav li:last-child { margin-right:0; }
#gnav li a {
	cursor:pointer; display:block; padding: 24px 30px 26px; text-align:center;
  color: #fff; text-decoration: none;
}
#gnav li a:hover, #gnav li a.active {
  -webkit-transition: all .0s; transition: all .0s;
  background: url(../img/gnav_arrow.png) no-repeat bottom 15px center;

}

#mobile { display:none; }

#close { display:none; }
/* pagetop------------------------ */
.pageTop { position: fixed; bottom: 15px; right: 20px; width: 60px; z-index:99; }
.pageTop a { display:block; }
/* footer-------------------*/
footer {
  max-width:1200px; width: 100%; margin: 0 auto 40px;
  padding: 80px 20px 50px; background:#311f08; color: #fff;
}
footer a { color: #fff; }
footer .f_logo { width: 350px; margin: 0 auto; }
footer .inner { width:90%; margin:0 auto; padding:50px 0 10px; }
#fnav_box { width: 50%; }
#fnav_box a { text-decoration: none; }
#fnav_box .nav_box { margin-bottom: 30px; }
#fnav_box .nav_box > li { width: 36%; margin: 0 20px; }
#fnav_box .nav a {
  display: block; padding: 16px 10px 10px;
  border-bottom: 1px solid #5a4c39; position: relative;
}

.btn_nav { display:none;  }

/* title */
.c_ttl {
  padding-block: 10px; margin: 0 0 1em;
  text-align: center; background:url(../img/txt_bg.png) no-repeat center / contain;
}
.c_ttl span {
  font-weight: bold; font-size: 16px;
}




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

  #fnav_box .nav a:hover::before {
    content: url(../img/arrow2.png); position: absolute; left: -20px; top: 14px;
  }
}
#fnav_box .sub { width: 100%; }
#fnav_box .sub a { padding: 0 20px; border-right: 1px solid #5a4c39; }
#fnav_box .sub li:last-child a { border-right: none; }
footer .access { width: 45%; }
footer .access h3 {
  padding-left: 24px; font-size: 18px;
  background: url(../img/ico_access.png) no-repeat left center;
}
footer .sns_icon {
  margin: 25px auto;
  justify-content: center; -webkit-justify-content: center;
}
footer .sns_icon li { width: 31px; margin: 0 7px; float: none; }


#copyright { margin:0; padding:5px 0; font-size:13px; text-align:center; }

/*----------------------------------------------------
タブレット
-----------------------------------------------------*/
@media screen and (max-width: 1080px) {

.pc_none { display:inherit; } 
.tb_none { display:none; }
/* base------------------------ */
#contents { width:auto; margin:0 20px; }

/* header------------------------ */
  #main_area .top_ttl { top: 390px; bottom: inherit; }
  header { background-repeat: repeat-x; }
  header .inner { width:100%; padding: 40px 10px 30px; }
  header #hlogo {
    width: 60%; max-width: 400px; margin: 10px auto 0; float: none;
    text-align: center;
  }
  header h1 {
    width: 100%; margin-top: 14px; float: none; text-align: center;
  }
  
  header .hbox {
    display: flex; display: -webkit-flex; flex-wrap: wrap;
    -webkit-flex-wrap: wrap; top: 40px; left: 40px; width: 30%;
    margin: 0;
  }
  header .hbox .con_box { display: none; }

/* nav------------------------ */
#mobile {
	display:inline-block; text-align:right; margin-right: 20px;
  position: absolute; top: 40px; right: 20px;
}
#mobile a {
	display:inline-block; padding:12px 20px; font-weight:bold;
  font-size:20px; font-style: normal; text-decoration:none; color:#fff; background:#000; border-radius:5px;
}
.head-nav{ display:none; }
.header-box{ width:auto; }
#sidr-nav .sidr-class-snav, #sidr-nav .sidr-class-sns_icon {
	border:none; display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
#sidr-nav .sidr-class-snav { margin:0 10px; }
#sidr-nav .sidr-class-snav li, #sidr-nav .sidr-class-sns_icon li {
	padding:0; border:none; line-height:100%;
}
#sidr-nav .sidr-class-snav li { width:46%; margin:4px 2%; }
#sidr-nav .sidr-class-snav li a {
	width:100%; padding:6px 0; text-align:center; background:#f6c725;
  border-radius: 5px;
}
#sidr-nav .sidr-class-snav li a:hover,
#sidr-nav .sidr-class-sns_icon {
  margin-bottom: 0;
  justify-content: center; -webkit-justify-content: center;
}
#sidr-nav .sidr-class-sns_icon li a { width: 45px; padding:10px 7px; }
#sidr-nav .sidr-class-sns_icon li a:hover { box-shadow:none; }
#sidr-nav .sidr-class-tel {
  margin: 0; font-size: 26px; font-style: normal; color: #311f08;
  line-height: 100%; text-align: left;
}
#sidr-nav .sidr-class-tel span {
  display: inline-block; padding: 2px 8px; margin: 5px 8px;
  border: 1px solid; font-size: 13px; line-height: 100%;
}
#sidr-nav .sidr-class-tel a { text-decoration: none; }
#sidr-nav .sidr-class-con_box { display: none; }
#sidr-nav #sidr-id-lang,
#sidr-nav #sidr-id-lang li { border: none; }
#sidr-nav #sidr-id-lang {
  overflow: hidden; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center;
  justify-content: center; margin-top: 10px;
}
#sidr-nav #sidr-id-lang a {
display: inline-block; text-decoration: none;
padding: 6px 17px; margin: 0 5px; border: 2px solid #000;
font-style: normal; font-size: 18px;
}
#sidr-nav #sidr-id-lang .sidr-class-active { padding: 4px 16px; border-width: 4px; }
#sidr-id-close a {
	display:inline-block; width:90%; margin:10px 10px 0; padding:4px 10px;
	font-weight:bold; font-size:16px; text-decoration:none; text-align:center;
	color:#fff; background:#000; border-radius:5px;
}
/* footer------------------------ */
footer { margin-bottom: 0; }
footer .inner { width:auto; margin:0; }
}
@media screen and (max-width: 980px) {
  #main_area .top_ttl { top:290px; }
  
  #mobile { margin-right: 0; }
  header .hbox { left: 20px; }
}
@media screen and (max-width: 799px) {

  header .inner { padding: 14px 10px 12px; }
  header .hbox { width: 10%; left: 10px; top: 10px; }
  header #lang .jp { display: none; }
  header #hlogo { max-width: 360px; padding-right: 2%; }
  header h1 { padding-right: 2%; }
  #mobile { right: 10px; top: 10px; }

  #main_area .top_ttl {
    width: 100%; left: 0;right: 0; text-align: center;
  }
  /* nav------------------------ */

  /* footer------------------------ */
  footer { padding: 40px 20px; }
  #fnav_box, footer .access { width: 100%; }
  #fnav_box .nav_box > li { width: 42%; margin: 0 3%; }
  #fnav_box .sub { justify-content: flex-end; -webkit-justify-content: flex-end; }
}

@media screen and (max-width: 667px) {
 #main_area .top_ttl { top:250px; }
 .comment {top: -10px!important; }
}

/*----------------------------------------------------
スマホ
-----------------------------------------------------*/
@media screen and (max-width: 599px) {
.pc_none { display:inherit; } 
.tb_none { display:inherit; }
.sp_none { display:none; }
.sp_wide { width:100%; }
/* base------------------------ */
#contents { margin:0 14px; }
#pan { margin:10px auto 20px }
br.sp { display:none; }

/* header------------------------ */
  header #hlogo { width: 60%; margin: 2px auto 0; }
  header h1 { line-height: 100%; font-size: 12px; }
  header .hbox { width: 20%; }
  header #lang a { padding: 6px 10px; font-size: 14px; }
  header #lang a.active { padding: 4px 8px; }
  #main_area .top_ttl { top:140px; }
  #main_area .top_ttl img { padding: 0 30px; }
  
 
  
/* nav------------------------ */

  #mobile a { padding:10px; font-size:14px; }

/* footer------------------------ */
  footer { padding: 40px 10px 70px; }
  footer .inner { padding: 20px 0 0; }
  footer .f_logo { width: 300px; }
  #fnav_box { margin-bottom: 20px; }
  #fnav_box .nav_box > li { width: 46%; margin: 0; }
  #fnav_box .nav_box > li:first-child { margin-right: 5%; }
  #fnav_box .nav a { padding: 8px 10px 6px; font-size: 14px; }
  footer .access dd { width: auto; }
  #fnav_box .sub { justify-content: flex-start; }
  #fnav_box .sub a { display: block; padding: 0 10px; font-size: 14px; }
  footer .sns_icon { margin: 20px auto; }

.pageTop { display:none;}
	
.btn_nav { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap:wrap; 
	       position:fixed; width:100%; bottom:0; right: 0; z-index: 9999; } 	
.btn_nav li a { display:block;text-decoration:none; }
	
.btn_nav .tel { width:60%; padding:2% 2% 0; text-align:center; font-size:25px; font-style: normal; font-weight:bold; background:rgba(246,199,37,0.8); }	
.btn_nav .tel a {color:#311f08; text-decoration:none; }
.btn_nav .tel strong { position:relative; display:block; font-size:11px; font-weight:normal; letter-spacing:0.1em; color:#fff; background:#311f08;}
.btn_nav .tel span{ font-size:25px;}	
	
.btn_nav .access { padding-top:2%; width:22%; text-align: center; background:rgba(255,255,255,0.8); }
.btn_nav .access span { color:#311f08; font-size:12px; font-weight:bold;  }
.btn_nav .access img {  display:block; margin:0 auto; max-width:35%; }
	
.btn_nav .pagetop { padding-top:18px; width:18%; text-align:center; background:rgba(49,31,8,0.8);  }
.btn_nav .pagetop a img{ width:26px; }
	
#copyright { line-height:120%; }

}

/* 600px 以上 ------------------------ */
@media screen and (min-width: 600px) {
  .sp_none { display: block; }
  .sp_only { display:none; }
}


@media screen and (max-width: 320px) {
  #main_area .top_ttl { top:120px; }
}