@charset "UTF-8";
/*各要素全体のリセット - YUI Reset CSS 参照*/
body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}
li,ul,ol {
	margin: 0 ;
	padding: 0;
}
table {
	border-collapse: collapse ;
	border-spacing: 0 ;
}
fieldset,img {
	border: 0 ;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal ;
	font-weight: normal ;
}
ol,ul,li {
	list-style: none ;
}
h1,h2,h3,h4,h5,h6 {
	font-size: 100% ;
	font-weight: normal ;
}
q:before,q:after {
	content:'';
}
abbr,acronym {
	border: 0 ;
}
a:focus{ outline: none ; }

.bordernone{
	border:none !important;
}
.onlySP{
	display:none!important
}
@media screen and (max-width:767px){
	.onlyPC{display:none!important}
	.onlySP{display:block!important}
	img{width: 100%;}
}

@media print{
  /*背景画像を表示*/
  body {
  -webkit-print-color-adjust: exact;
   zoom: 70%;/*ページの縮小（IEのみ）*/
  }

  /*画像サイズを指定する場合*/
  @page { size: A4 } /* A4縦 */
  @page { size: A4 landscape} /* A4横 */
  @page { size: 210mm 297mm } /* A4縦サイズ */


  /*上記＋余白*/
  @page {
    size: A4;
  margin: 12.7mm 9.7mm;
  }
  @page {
    size: A4;
  margin: 12.7mm 9.7mm;
  }
}

/*-------------------------------------------

WEBフォント

--------------------------------------------*/
/* Noto sans CJK jp ゴシック */
@font-face {
   font-family: 'NotoSansJP';
   font-style: normal;
   font-weight: 400;
   src:url(/fonts/NotoSansJP-Regular.woff2) format('woff2'),
   url(/fonts/NotoSansJP-Regular.woff) format('woff'),
   url(/fonts/NotoSansJP-Regular.otf) format('opentype');
}
@font-face {
   font-family: 'NotoSansJP';
   font-style: normal;
   font-weight: 700;
   src:url(/fonts/NotoSansJP-Bold.woff2) format('woff2'),
   url(/fonts/NotoSansJP-Bold.woff) format('woff'),
   url(/fonts/NotoSansJP-Bold.otf) format('opentype');
}
/* Noto sans CJK jp 明朝 */
@font-face {
   font-family: 'NotoSerifJP';
   font-style: normal;
   font-weight: 400;
   src:url(/fonts/NotoSerifJP-Regular.woff2) format('woff2'),
   url(/fonts/NotoSerifJP-Regular.woff) format('woff'),
   url(/fonts/NotoSerifJP-Regular.otf) format('opentype');
}
@font-face {
   font-family: 'NotoSerifJP';
   font-style: normal;
   font-weight: 700;
   src: url(/fonts/NotoSerifJP-Bold.woff2) format('woff2'),
   url(/fonts/NotoSerifJP-Bold.woff) format('woff'),
   url(/fonts/NotoSerifJP-Bold.otf) format('opentype');
}



/*-------------------------------------------

ベース

--------------------------------------------*/
body{
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  font-size:12px;
  line-height:20px;
  font-family: NotoSansJP, '游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;
  background:url(/arthall/images/common_bg_03.gif);
  padding:0 !important;
  margin:0 !important;
  color:#000;
  position: relative;
  word-break: break-all;
  word-break: normal;
  text-align: justify;
}
.min{
	font-family: NotoSerifJP, "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important;
}
table {
	font-size: inherit ;
	font: 100% ;
}
img {
	border : none ;
	vertical-align: bottom !important ;
}
select,input,textarea,option {
	vertical-align: middle ;
}
i { font-style: normal !important;}
hr {
	clear: both ;
	background: #ffffff ;
	color: #ffffff ;
	border-top: 0px none #ffffff ;
	border-right: 0px none #ffffff ;
	border-left: 0px none #ffffff ;
	border-bottom: 1px solid #999999 ;
}
em {
	font-style: normal ;
	font-weight: bold ;
}
strong {
	font-size: 14px ;
	font-style: normal ;
	font-weight: bold ;
}
big {
	font-size: 18px ;
	font-weight: bold ;
}
small {
	font-size: 10px ;
	font-size: 10px ;
}
a {transition: .3s;}
a:hover {opacity: 0.6;}
a img:hover{
	opacity: 0.6;
	transition: .3s;
}



/*-------------------------------------------

レイアウト

--------------------------------------------*/
#wrapper{
	position: relative;
}
#right_main{
  width: calc( 100% - 220px );
	position: relative;
	left: 220px;
	top: 0;
}
/*インナー*/
.inner_box{
	max-width: 1070px;
	margin:0 auto;
	padding: 0 15px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}
.inner_box_smole{
	max-width: 750px;
	margin:0 auto;
	padding: 0 15px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}
.inner_box_middle{
	max-width: 990px;
	margin:0 auto;
	padding: 0 15px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}
@media only screen and (max-width: 1024px) {
	#right_main{
		width: 100%;
		left: 0;
		padding-top: 80px;
	}
}
@media only screen and (max-width: 767px) {
	#right_main {
	  padding-top: 40px;
	}
}




/*-------------------------------------------

省略スタイル

--------------------------------------------*/
/*テキスト位置*/
.tl { text-align: left !important ; } /*左*/
.tr { text-align: right !important ; } /*右*/
.tc { text-align: center !important ; } /*中央*/

/*上下寄せ*/
.vt { vertical-align: top ; } /* 上寄せ */
.vt img { vertical-align: top ; }
.vm { vertical-align: middle ; } /* 中央寄せ */
.vm img { vertical-align: middle ; }
.vb { vertical-align: bottom ; } /* 下寄せ */
.vb img { vertical-align: bottom ; }

/*フォントサイズ・色*/
.fs10{font-size:10px;}
.fs14{font-size:14px;}
.fwb{font-weight:bold;}
.red{color:#f90000;}
.c_red{color: #ff0000;}

/*各上下左右マージン指定*/
.mt0 { margin-top: 0px !important ; }
.mt5 { margin-top: 5px !important ; }
.mt10 { margin-top: 10px !important ; }
.mt15 { margin-top: 15px !important ; }
.mt17 { margin-top: 17px !important ; }
.mt20 { margin-top: 20px !important ; }
.mt25 { margin-top: 25px !important ; }
.mt30 { margin-top: 30px !important ; }
.mt35 { margin-top: 35px !important ; }
.mt40 { margin-top: 40px !important ; }
.mt45 { margin-top: 45px !important ; }
.mt50 { margin-top: 50px !important ; }
.mt60 { margin-top: 60px !important ; }
.mt70 { margin-top: 70px !important ; }
.mt80 { margin-top: 80px !important ; }
.mt100 { margin-top: 100px !important ; }
.mb0 { margin-bottom: 0px !important ; }
.mb5 { margin-bottom: 5px !important ; }
.mb10 { margin-bottom: 10px !important ; }
.mb15 { margin-bottom: 15px !important ; }
.mb20 { margin-bottom: 20px !important ; }
.mb25 { margin-bottom: 25px !important ; }
.mb30 { margin-bottom: 30px !important ; }
.mb35 { margin-bottom: 35px !important ; }
.mb40 { margin-bottom: 40px !important ; }
.mb45 { margin-bottom: 45px !important ; }
.mb50 { margin-bottom: 50px !important ; }
.ml0 { margin-left: 0px !important ; }
.ml5 { margin-left: 5px !important ; }
.ml10 { margin-left: 10px !important ; }
.ml15 { margin-left: 15px !important ; }
.ml20 { margin-left: 20px !important ; }
.ml25 { margin-left: 25px !important ; }
.ml30 { margin-left: 30px !important ; }
.ml35 { margin-left: 35px !important ; }
.ml40 { margin-left: 40px !important ; }
.ml45 { margin-left: 45px !important ; }
.ml50 { margin-left: 50px !important ; }
.mr0 { margin-right: 0px !important ; }
.mr5 { margin-right: 5px !important ; }
.mr10 { margin-right: 10px !important ; }
.mr12 { margin-right: 12px !important ; }
.mr15 { margin-right: 15px !important ; }
.mr20 { margin-right: 20px !important ; }
.mr25 { margin-right: 25px !important ; }
.mr30 { margin-right: 30px !important ; }
.mr35 { margin-right: 35px !important ; }
.mr40 { margin-right: 40px !important ; }
.mr45 { margin-right: 45px !important ; }
.mr50 { margin-right: 50px !important ; }

.pt0 { padding-top: 0px !important ; }
.pt5 { padding-top: 5px !important ; }
.pt10 { padding-top: 10px !important ; }
.pt15 { padding-top: 15px !important ; }
.pt20 { padding-top: 20px !important ; }
.pt25 { padding-top: 25px !important ; }
.pt30 { padding-top: 30px !important ; }
.pt35 { padding-top: 35px !important ; }
.pt40 { padding-top: 40px !important ; }
.pt45 { padding-top: 45px !important ; }
.pt50 { padding-top: 50px !important ; }
.pt93 { padding-top: 93px !important ; }
.pt100 { padding-top: 100px !important ; }
.pt103 { padding-top: 103px !important ; }
.pb0 { padding-bottom: 0px !important ; }
.pb5 { padding-bottom: 5px !important ; }
.pb10 { padding-bottom: 10px !important ; }
.pb15 { padding-bottom: 15px !important ; }
.pb20 { padding-bottom: 20px !important ; }
.pb25 { padding-bottom: 25px !important ; }
.pb30 { padding-bottom: 30px !important ; }
.pb35 { padding-bottom: 35px !important ; }
.pb40 { padding-bottom: 40px !important ; }
.pb45 { padding-bottom: 45px !important ; }
.pb50 { padding-bottom: 50px !important ; }
.pl0 { padding-left: 0px !important ; }
.pl1 { padding-left: 1px !important ; }
.pl5 { padding-left: 5px !important ; }
.pl10 { padding-left: 10px !important ; }
.pl15 { padding-left: 15px !important ; }
.pl20 { padding-left: 20px !important ; }
.pl25 { padding-left: 25px !important ; }
.pl30 { padding-left: 30px !important ; }
.pl35 { padding-left: 35px !important ; }
.pl40 { padding-left: 40px !important ; }
.pl45 { padding-left: 45px !important ; }
.pl50 { padding-left: 50px !important ; }
.pl60 { padding-left: 60px !important ; }
.pr0 { padding-right: 0px !important ; }
.pr1 { padding-right: 1px !important ; }
.pr2 { padding-right: 2px !important ; }
.pr3 { padding-right: 3px !important ; }
.pr5 { padding-right: 5px !important ; }
.pr10 { padding-right: 10px !important ; }
.pr12 { padding-right: 12px !important ; }
.pr15 { padding-right: 15px !important ; }
.pr18 { padding-right: 18px !important ; }
.pr20 { padding-right: 20px !important ; }
.pr28 { padding-right: 28px !important ; }
.pr29 { padding-right: 29px !important ; }
.pr25 { padding-right: 25px !important ; }
.pr30 { padding-right: 30px !important ; }
.pr35 { padding-right: 35px !important ; }
.pr40 { padding-right: 40px !important ; }
.pr45 { padding-right: 45px !important ; }
.pr50 { padding-right: 50px !important ; }
.pr60 { padding-right: 60px !important ; }

.wd30{width:30px !important;}
.wd50{width:50px !important;}
.wd60{width:60px !important;}
.wd84{width:84px !important;}
.wd100{width:100px !important;}
.wd150{width:150px !important;}
.wd180{width:180px !important;}
.wd200{width:200px !important;}
.wd250{width:250px !important;}
.wd280{width:280px !important;}
.wd300{width:300px !important;}
.wd320{width:320px !important;}
.wd350{width:350px !important;}
.wd380{width:380px !important;}
.wd390{width:390px !important;}
.wd400{width:400px !important;}
.wd420{width:420px !important;}
.wd450{width:450px !important;}
.wd480{width:480px !important;}
.wd500{width:500px !important;}
.wd550{width:550px !important;}
.wd580{width:580px !important;}
.wd600{width:600px !important;}
.wd620{width:620px !important;}
.wd630{width:630px !important;}
.wd650{width:650px !important;}
.wd660{width:660px !important;}
.wd665{width:665px !important;}



/*-------------------------------------------

クリア

--------------------------------------------*/
/*floatとクリア*/
.fl { float: left ; } /*左回り込み*/
.fr { float: right !important ; } /*右回り込み*/

div.cf div.nfr{
	float: right;
	width: 50%;
}
div.cf div.nfl{
	float: right;
	width: 50%;
}

/*brなどの空要素を入れずにfloatの回り込みを解除する指定(親要素にfcbと指定)*/
.fcb {
	display: inline-block ;
}
.fcb:after {
	content: "." ;
	font-size: 0.1em ;
	line-height: 0 ;
	display: block ;
	height: 0 ;
	visibility: hidden ;
	clear: both ;
}
/* \*/
* html .fcb {
  height: 1% ;
}
.fcb {
  display: block ;
}
/* */

.clear {clear:both;}

/*for clearFix*/
.cf:after {
	display: block ;
	height: 0 ;
	visibility: hidden ;
	clear: both ;
	content:".";
	overflow:hidden;
	font-size:0.1em;
	line-height:0;
}

/* 追加 MacIE 5 と WinIE 7 向け */
.cf {
   display: inline-block ;
}

/*MacIE \*/
* html .cf {
	height: 1em ;
}
.cf {
	display: block ;
}



/*---------------------------

	トップコンテンツ
	top_con

---------------------------*/
.tab_ver{
	display: none !important;
}
.top_con{
	background: #161616;
	height: 40px;
	line-height: 40px;
	color: #fff;
}
.top_con .box01{
	font-size: 1.083em;
	letter-spacing: 2px;
	width: 50%;
	float: left;
}
.top_con .box02{
	width: 50%;
	float: right;
	text-align: right;
	position: relative;
	padding-right: 40px;
	box-sizing:border-box;
}
@media only screen and (max-width: 767px) {
  .top_con .box02{
  position:static;
  }
}
.top_con .english{
	font-size: 1.167em;
	display: inline-block;
	padding: 0 20px;
	border-left: 1px solid #0d0d0d;
	border-right: 1px solid #0d0d0d;
	position: relative;
	cursor:pointer;
	margin-right: 20px;
}
.top_con .english a{
  color: #fff;
  text-decoration: none;
}
.top_con .english:after{
	content: "";
	display: block;
	width: 0;
	height: 0;
	border: 5px transparent solid;
	border-bottom: 5px #fff solid;
	-webkit-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	transform: rotate(135deg);
	position: absolute;
	right: 0;
	bottom:2px;
}

/* フォントサイズ */
.top_con .fontsize{
	font-size: 1.083em;
	color: #fff;
	width: auto;
	display: inline !important;
}
.top_con .fontsize *{
	display:inline !important;
}
.top_con .fontsize #fchange {
	margin-left: 15px;
}
.top_con .fontsize #fchange .fsize + .fsize{
	margin-left: 5px;
}
.top_con .fontsize #fchange .fsize#fmiddle a {
	cursor:pointer;
	background: #fff;
	color: #000;
	height: 20px;
	line-height: 20px;
	padding: 0 10px;
	text-decoration: none;
	border-radius: 2px;
}
.top_con .fontsize #fchange .fsize#flarge a {
	cursor:pointer;
	color: #fff;
	height: 20px;
	line-height: 20px;
	padding: 0 10px;
	text-decoration: none;
	border-radius: 2px;
}
#changeArea{
	font-size: 100%;
	*font-size: 100%;
	background:none !important;
}

/* search */
.top_con #search{
  font-size: 1.083em;
  display: inline-block;
  line-height: 1;
  letter-spacing: 1px;
  position: absolute;
  right: 0;
  top: 6px;
  max-width: 500px;
}
.top_con #search .search_btn{
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
  cursor: pointer;
}
.search_main{
  position: absolute;
  right: 0;
  top: 35px;
  z-index: 1;
  height: 0px;
  overflow: hidden;
  transition: height 0.3s ease-out;
  background: #fff;
  padding: 0 20px;
}
.search_btn_area .search_main{
  top: 80px;
}
.search_main.show{
  height: 100px;
}
.search_main .closebtn{
  position: absolute;
  top: 10px;
  right: 10px;
  color: #000;
  font-size: 2em;
  cursor: pointer;
  line-height: 1;
}
/*Yahoo search*/
.srchBox{
  width: 425px;
  color: #000000;
  text-align: right;
  box-sizing: border-box;
  border: none;
}
.srchBox form p.logo{
  text-align: left;
  padding-top: 40px;
}
.srchBox form p.logo a{
  display: inline-block;
  vertical-align: middle;
}
.srchBox form p.logo a img{
  max-width: 45px;
}
.srchBox form input[type="text"]{
  width: 320px;
  padding: 5px 5px;
  border: 1px solid #000;
  height: 28px;
  box-sizing: border-box;
  margin: 0 5px;
  outline: none;
}
.srchBox form input[type="submit"]{
  margin: 0;
  width: 38px;
  height: 28px;
  border: none;
  background: #474747;
  line-height: 1;
  font-size: 12px;
  color: #fff;
  cursor: pointer;
}
.srchBox form ul{
  text-align: left;
  line-height: 1;
  margin-top: 7px;
  padding-left: 55px;
}
.srchBox form ul li{
  display: inline-block;
  margin-right: 10px;
}
.srchBox form ul li label input[type="radio"] {
  display: none;
}
.srchBox form ul li label input[type="radio"]:checked + span {
  color: #3a3a3a;
}
.srchBox form ul li label input[type="radio"]:checked + span:before {
  background: #0099ff;
  border-color: #0099ff;
}
.srchBox form ul li label input[type="radio"]:checked + span:after {
  content: "";
  display: block;
  position: absolute;
  top: 4px;
  left: 4px;
  width: 7px;
  height: 7px;
  background: #fff;
  border-radius: 10px;
}
.srchBox form ul li label span {
  display: inline-block;
  position: relative;
  padding-left: 20px;
  cursor: pointer;
  padding-top: 1px;
}
.srchBox form ul li label span:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 13px;
  height: 13px;
  border: 1px solid #b7b7b7;
  border-radius: 13px;
}
@media only screen and (max-width: 1024px) {
  #sp_search{
  padding:0 15px 25px;
  }
  /*Yahoo search*/
  .srchBox{
    width: 100%;
  }
  .srchBox form p.logo {
    padding-top: 0;
  }
  .srchBox form input[type="text"] {
    width: calc( 100% - 100px );
  }
  .srchBox form ul li label input[type="radio"]:checked + span,
  .srchBox form ul li label span {
      color: #fff;
  }
}




































/*---------------------------

	footer

---------------------------*/
.footer{
	color: #fff;
	margin-top: 70px;
  margin-bottom: -1px;
}
.footer a{
	color: #fff !important;
	text-decoration: none !important;
}
/*footer_top*/
.footer .footer_top{
	background: #393939;
	font-size: 1.083em;
	padding: 12px 0;
}
.footer .footer_top .inner_box_big{
	position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}
.footer .footer_top .inner_box{
	position: relative;
}
.footer .pagetop{
  position: fixed;
  /*bottom: -100px;*/
  right: 2%;
  top: auto;
  left: auto;
}
.footer .footer_top .box01{
	float: left;
	display: inline-block;
	width: auto;
}
.footer .footer_top .box01 p{
	display: inline-block;
}
.footer .footer_top .box01 p.address{
  display: block;
}
.footer .footer_top .box01 p:last-of-child{
	margin-left: 10px;
}
/*
.footer .footer_top .box01 p + p{
	margin-left: 10px;
}
*/
.footer .footer_top .box01 p span.smole{
	font-size: 0.846em;
}
.footer .footer_top .box01 p.tel{
	background: url(/arthall/images/footer_icon01.png) no-repeat left center;
	padding-left: 15px;
}
.footer .footer_top .box02{
	float: right;
  /*
	display: inline-block;
	width: auto;
  */
}
.footer .footer_top .box02 ul{
	width: auto;
  padding-top: 9px;
  text-align: right;
}
.footer .footer_top .box02 ul li{
	display: inline-block;
  font-size: 0.893em;
}
.footer .footer_top .box02 li:first-child:before,
.footer .footer_top .box02 li:after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 18px;
  background: #fff;
  vertical-align: middle;
  margin: 0 7px 0 12px;
  transform: rotate(-30deg);
}

/*footer_bottom*/
.footer .footer_bottom {
	background: #292929;
}
.footer .footer_bottom .box01 {
	border-bottom: 1px solid #3f3f3f;
}
.footer .footer_bottom .box01 .logo {
	float: left;
	display: inline-block;
	line-height: 18px;
	height: 18px;
	padding: 26px 0;
}
.footer .footer_bottom .box01 .logo .btn {
	margin-left: 15px;
	background: #fff;
	font-family: NotoSerifJP, "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #000 !important;
	letter-spacing: 0.5px;
	padding: 0 5px;
	display: inline-block;
}
.footer .footer_bottom .box01 .cf {
	float: right;
	display: inline-block;
	padding: 17px 0;
	font-size: 1.115em;
}
.footer .footer_bottom .box01 .cf *{
	display: inline-block;
}
.footer .footer_bottom .box01 .cf:before,
.footer .footer_bottom .box01 .cf li:after {
	content: "";
	display: inline-block;
	width: 1px;
	height: 22px;
	background: #3f3f3f;
	vertical-align: middle;
}
.footer .footer_bottom .box01 .cf li a{
	background: url(/arthall/images/footer_icon02.png) no-repeat left 25px center;
   padding: 8px 25px 8px 65px;
}
.footer .footer_bottom .box02 {
	padding: 15px 0;
	text-align: center;
	font-size: 0.846em;
	color: #7f7f7f;
}
.footer .footer_bottom .box02 .copy a {
	color: #7f7f7f !important;
}
@media only screen and (min-width: 1024px) {
  .footer .footer_top .box01{
  width: 355px;
  }
  .footer .footer_top .box02{
  width:calc( 100% - 360px );
  }
}
@media print , screen and (max-width: 1023px) and (min-width: 768px) {
  .footer .footer_top .box01{
  width: 100%;
  float: none;
  }
  .footer .footer_top .box01 p{
  display: inline-block !important;
  }
  .footer .footer_top .box01 p+p{
  margin-left: 10px;
  }
  .footer .footer_top .box02{
  width: 100%;
  float: none;
  }
  .footer .footer_top .box02 ul{
  text-align: left;
  }
  .footer .footer_top .box02 ul li{
  }
}
@media print , screen and (max-width: 1240px) and (min-width: 768px) {
  .footer .footer_top .inner_box_big {
    max-width: 1030px;
  }
  /*
	.footer .footer_top .box02 {
	  float: none;
	  margin-top: 10px;
	  width: 100%;
  }
  */
}
@media print , screen and (max-width: 1460px) and (min-width: 768px) {
  /*
	.footer .footer_top .box02 {
	  float: none;
	  margin-top: 10px;
  }
  */
}
@media print , screen and (max-width: 860px) and (min-width: 768px) {
	.footer .footer_bottom .box01 .cf li a {
	  background: url(/arthall/images/footer_icon02.png) no-repeat left 5px center;
	  padding: 8px 10px 8px 45px;
	}
}
@media only screen and (max-width: 767px) {
	.footer{
		margin-top: 10%;
	}
  .footer .pagetop{
    position: fixed;
    /*bottom: -100px;*/
    right: 5%;
    top: auto;
    left: auto;
  }
  .footer .pagetop a img{
    width: 45px;
    height:auto;
  }
  .footer .pagetop a:hover,
  .footer .pagetop a:hover img{
    opacity: 1;
  }
	.footer_middle{
		background: #393939;
		font-size: 1.15em;
	}
	.footer_middle .linkbox01{
		text-align: center;
		padding: 15px 15px 30px;
		border-bottom: 2px solid #303030;
	}
	.footer_middle .linkbox01 p{
		display: inline-block;
		margin-right: 15px;
		margin-top: 15px;
	}
	.footer_middle .linkbox01 a{
		display: inline-block;
		color: #fff;
		border: 2px solid #fff;
		padding: 6px 30px 7px 10px;
		position: relative;
		margin-top: 15px;
	}
	.footer_middle .linkbox01 a:after {
		display: block;
		content: "";
		width: 5px;
		height: 5px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: rotate(45deg);
		position: absolute;
		right: 15px;
		top: 50%;
		margin-top: -2px;
	}
	/*box02*/
	.footer_middle .linkbox02{
		width: 100%;
		padding: 30px 15px 15px;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
	}
	.footer_middle .linkbox02 li{
		width: 50%;
		float: left;
		margin-bottom: 15px;
	}
	.footer_middle .linkbox02 li a{
		display: block;
		position: relative;
		color: #fff;
		padding: 0  10px 0 23px;
		line-height: 23px;
	}
	.footer_middle .linkbox02 li a:before{
		display: block;
		content: "";
		width: 6px;
		height: 6px;
		border-top: 2px solid #727272;
		border-right: 2px solid #727272;
		transform: rotate(45deg);
		position: absolute;
		left: 5px;
		top: 7px;
	}
	/*sp_box01*/
	.footer .footer_bottom .inner_box {
	  padding: 0;
	}
	.footer .sp_box01{
		text-align:center;
		padding: 0 15px 30px;
		border-bottom: 2px solid #3f3f3f;
	}
	.footer .sp_box01 img{
		width: 100%;
		max-width: fit-content;
		margin: 30px 0;
	}
	.footer .sp_box01 ul {
		width: 95%;
		margin: 0 auto;
		font-size: 1.417em;
	}
	.footer .sp_box01 li{
		width: 32%;
		float: left;
	}
	.footer .sp_box01 li + li{
		margin-left: 2%;
	}
	.footer .sp_box01 li a{
		display: table;
		width: 100%;
		font-weight:normal;
	}
	.footer .sp_box01 li a span{
		display: table-cell;
		text-align: center;
		vertical-align: middle;
		color: #fff;
		font-size: 0.846em;
		background: #141414 url(/arthall/images/footer_icon_sp02.png) no-repeat right bottom;
		background-size: 15px auto;
		line-height: 22px;
		font-weight: normal;
		padding: 10px;
		}
	.footer .sp_box01 li.color a span{
		background:#000 url(/arthall/images/footer_icon_sp01.png) no-repeat right bottom;
	}
}


/*---------------------------

  bottom_con
  ボトムコンテンツ

---------------------------*/
.bottom_con{
  margin-top: 125px;
  margin-bottom:110px;
}
.bottom_con *{
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
}
.bottom_con .inner_box{
  display: flex;
  justify-content: space-between;
  /* align-items: baseline; */
  align-items: center;  
}
.bottom_con .left_con {
  width: calc( 60% - 25px );
  /*float: left;*/
  background: #fff;
  position: relative;
  padding: 30px 135px 30px 35px;
}
.bottom_con .left_con:before{
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: 30px transparent solid;
  border-bottom: 30px #f5f5f5 solid;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  left: -30px;
  top: -30px;
}
.bottom_con .left_con img.ttl {
  position:absolute;
  right: 30px;
  top:-35px;
}
.bottom_con .left_con .text {
  float: left;
  width: calc( 100% - 200px );
  position: relative;
  min-height: 237px;
  padding-bottom: 60px;
}
.bottom_con .left_con .text .ttl {
  background: url(/arthall/images/top_icon_02.png) no-repeat left center;
  font-size: 1.538em;
  font-weight: bold;
  padding:6px 0 5px 20px;
  letter-spacing: 1.5px;
  margin-bottom: 10px;
}
.bottom_con .left_con .text .ttl span {
  font-size: 0.650em;
  font-weight: normal;
  letter-spacing: 1px;
}
.bottom_con .left_con .text ul {
  font-size: 1.077em;
  color: #8b8b8b;
}
.bottom_con .left_con .text ul li {
  text-indent: -10px;
  padding-left: 10px;
}
.bottom_con .left_con .text ul li + li{
  margin-top: 5px;
}
.bottom_con .left_con .text ul li:before {
  content: "-";
  margin-right: 5px;
}
.bottom_con .left_con .text .link {
  text-align: right;
  position: absolute;
  bottom:0;
  right: 0;
}
.bottom_con .left_con .text .link a {
  font-size: 1.077em;
  color: #000;
  text-decoration: none;
}
.bottom_con .left_con .text .link a:before{
  content: url(/arthall/images/top_icon_03.png);
  line-height: 1;
  vertical-align: middle;
  margin-right: 5px;
}
.bottom_con .left_con .photo {
  float: right;
  width: 140px;
}
.bottom_con .left_con .photo img{
  width: 100%;
  height: auto;
}
@media print , screen and (max-width: 890px) and (min-width: 768px) {
  .bottom_con .left_con {
	  padding-right: 115px;
  }
  .bottom_con .left_con .photo {
	  width: 120px;
  }
  .bottom_con .left_con .photo img{
	  width: 100%;
	  height:auto;
  }
  .bottom_con .left_con .text {
	  width: calc( 100% - 130px );
  }
}
@media only screen and (max-width: 767px) {
	.bottom_con{
	  margin:50px 0 25px;
	}
  .bottom_con .inner_box{
    display: block;
  }
	.bottom_con .left_con {
	  width:100%;
	  float: none;
	  padding: 20px;
	}
	.bottom_con .left_con:before{
	  border: 20px transparent solid;
	  border-bottom: 20px #f5f5f5 solid;
	  left: -20px;
	  top: -20px;
	}
	.bottom_con .left_con img.ttl {
	   right: 20px;
	   top: -15px;
	   width: 16%;
	}
	.bottom_con .left_con .text {
	  float: none;
	  width: 100%;
	  min-height: auto;
	  padding-bottom: 0;
	}
	.bottom_con .left_con .text .ttl {
	  font-size: 1.538em;
	  padding:6px 0 5px 20px;
	  letter-spacing: 1.5px;
	  margin-bottom: 100px;
	}
	.bottom_con .left_con .text .ttl span {
		font-size: 0.650em;
		letter-spacing: 1px;
		line-height: 120%;
	}
	.bottom_con .left_con .text .link {
	  text-align:center;
	  position:static;
	  margin-top: 15px;
	}
	.bottom_con .left_con .text .link a {
	  font-size: 1.077em;
	  color: #000;
	  text-decoration:none;
		border-bottom:2px solid #bfbfbf;
		padding-bottom:2px;
		display:inline-block;
	}
	.bottom_con .left_con .photo {
		float: none;
		position: absolute;
		top: 20px;
		right:calc( 20% + 20px );
    width: auto;
	}
	.bottom_con .left_con .photo img{
		width: auto;
		height: 130px;
	}
  .bottom_con .left_con .text ul li:nth-child(1) {
    padding-right: 18%;
  }
}

/* .bottom_con .right_con */
.bottom_con .right_con {
  width:40%;
  /*float: right;*/
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}
.bottom_con .right_con .top_box {
  padding: 30px 0 20px;
}
.bottom_con .right_con .top_box p {
  text-align: center;
  font-size: 1.308em;
  letter-spacing: 1.5px;
  color: #000;
  margin-bottom: 10px;
}
.bottom_con .right_con .top_box p span {
  font-size: 0.618em;
  letter-spacing: 1px;
  color: #686868;
}
.bottom_con .right_con .top_box ul {
  display: table;
}
.bottom_con .right_con .top_box ul li {
  display: table-cell;
  width: 25%;
  vertical-align: top;
  text-align: center;
  position: relative;
}
.bottom_con .right_con .top_box ul li + li:before{
  content: "";
  display: block;
  width: 1px;
  height: 15px;
  background: #e0e0e0;
  position:absolute;
  top:50%;
  left: 0;
  margin-top: -7px;
}
.bottom_con .right_con .top_box ul li a {
  color: #000;
  text-decoration: none;
  letter-spacing: 0.5px;
  display: block;
}
.bottom_con .right_con .top_box ul li a:hover{
  opacity: 0.6;
}
.bottom_con .right_con .top_box ul li a:hover img{
  opacity: 1;
}
.bottom_con .right_con .top_box ul li a img {
  display:block;
  margin: 0 auto 5px;
}
.bottom_con .right_con .bottom_box {
  padding: 23px 0 21px;
  border-top: 1px solid #e0e0e0;
}
.bottom_con .right_con .bottom_box img{
  width: 100%;
}

@media only screen and (min-width: 768px) {
.bottom_con .right_con .bottom_box img{
  max-width: 396px;
}
}
@media only screen and (max-width: 767px) {
	.bottom_con .right_con {
		width:100%;
		float: none;
		margin-top:20px;
	}
	.bottom_con .right_con .top_box {
		padding: 20px 0 15px;
	}
	.bottom_con .right_con .top_box ul li {
		display: table-cell;
		width: 25%;
		vertical-align: top;
		text-align: center;
		position: relative;
		line-height: 140%;
	}
	.bottom_con .right_con .top_box ul li img{
		width:auto;
	}
	.bottom_con .right_con .bottom_box {
		padding: 20px;
	}
}



/*---------------------------

	bana_area
	ボトムリンクバナー

---------------------------*/

.bana_area{
	margin: 110px auto 70px !important;
  text-align: center;
}
.bana_area li{
  margin-bottom: 10px;
  display: inline-block;
	width:  calc( 20% - 16px );
}
.bana_area li + li{
	margin-left: 20px;
}
.bana_area li img{
	width: 100%;
}
@media only screen and (min-width: 768px) {
.bana_area li img{
  max-width: 191px;
}
}
@media only screen and (max-width: 767px) {
	.bana_area{
		margin: 10% auto 0 !important;
	}
	.bana_area li{
		float:left;
		width:  calc( 50% - 5px );
	}
	.bana_area li:nth-child(even){
		float:right;
	}
	.bana_area li + li{
		margin-left: 0;
	}
}


/*
.bana_area{
	margin: 110px auto 70px !important;
  text-align: center;
}
.bana_area li{
	float:left;
	margin-bottom: 10px;
	width:  calc( 20% - 16px );
}
.bana_area li + li{
	margin-left: 20px;
}
.bana_area li img{
	width: 100%;
}
@media only screen and (max-width: 767px) {
	.bana_area{
		margin: 25px auto 30px !important;
	}
	.bana_area li{
		float:left;
		width:  calc( 50% - 5px );
	}
	.bana_area li:nth-child(even){
		float:right;
	}
	.bana_area li + li{
		margin-left: 0;
	}
}
*/


/*---------------------------

	ぱんくず

---------------------------*/
#pankuzu{
	padding: 30px 0 10px;
	border-bottom: 1px solid #e0e0e0;
}
#pankuzu ul li{
	display:inline-block;
	letter-spacing: 1px;
}
#pankuzu ul li + li:before{
	content: "/";
	color: #c6c6c6;
	display: inline-block;
	padding: 0 5px 0 2px;
}
#pankuzu a:link{
	color:#000;
	text-decoration:none;
}
#pankuzu a:visited{
	color:#000;
	text-decoration:none;
}
#pankuzu a:hover{
	color:#000;
	text-decoration:underline;
}
@media only screen and (max-width: 767px) {
	#pankuzu{
		display: none;
	}
}



/*---------------------------

	カテゴリー アイコン

---------------------------*/
span.cate_icon{
	color: #fff;
	text-align: center;
	width: 100px;
	height: 20px;
	line-height: 20px;
	display: block;
	letter-spacing: 1px;
	font-weight: normal;
	background: #000;
	letter-spacing: 0.5px;
}
span.cate_icon.color01{background: #f93336;}
span.cate_icon.color02{background: #867e7e;}
span.cate_icon.color03{background: #36a767;}
span.cate_icon.color04{background: #4676c3;}
span.cate_icon.color05{background: #7b35a1;}



/*---------------------------

	見出し

---------------------------*/
.low_main{
	padding-top: 40px;
}
.low_main *{
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}
.low_main h1{
	font-size: 2.000em;
	color: #000;
	text-align: center;
	font-weight: bold;
	background: url(/arthall/images/ttl_bk_img.png) no-repeat center;
	padding: 20px 0;
	margin:0 0 45px;
	letter-spacing: 1.5px;
}
.low_main h1.no_en{
  padding: 30px 0;
}
.low_main.copy_n h1{
	padding: 26px 0;
}
.low_main h1 span.smole{
	font-size: 0.750em;
}
.low_main h1 span.en{
	font-size: 0.458em;
	color: #292929;
	font-weight: normal;
	margin-top: 10px;
	display: inline-block;
	letter-spacing: 1.5px;
	line-height: 1;
}

@media only screen and (max-width: 767px) {
	.low_main{
		padding-top: 0;
	}
	.low_main h1 {
	  color: #fff;
	  text-align: left;
	  background: none;
	  padding: 7px 0 13px 10px;
	  margin: 0 0 40px;
	  position: relative;
	  font-size: 1.167em;
	}
  .low_main h1.no_en{
    padding:7px 0 13px 10px;
  }
  .low_main.copy_n h1{
	  padding: 11px 0 16px;
  }
	.low_main h1 span.smole{
		font-size: 0.714em;
	}
	.low_main h1 span.en{
		margin-top: 3px;
		font-size: 0.500em;
	}
	.low_main h1:before {
	  content: "";
	  display: block;
	  width: 100%;
	  height: calc( 100% );
	  background: #292929;
	  z-index: -1;
	  position: absolute;
	  top: 0;
	  left: -45px;
	  -webkit-transform: skew(-35deg);
	  -moz-transform: skew(-35deg);
	  -o-transform: skew(-35deg);
	}
	.low_main h1 span.en{
		color: #fff;
	}

	/*doublettl*/
	.low_main h1.doublettl{
		display: table;
		margin-bottom: 20px;
	}
	.low_main h1.doublettl span.en{
		letter-spacing: 0;
	}
	.low_main h1.doublettl span.box_left,
	.low_main h1.doublettl span.box_right{
		display:table-cell;
		vertical-align: middle;
	}
	.low_main.copy_n h1.doublettl span.box_left{
		vertical-align: bottom;
  }
	.low_main h1.doublettl span.box_right{
		position: relative;
	   padding-left: 15px;
	}
	.low_main h1.doublettl span.box_right:before{
		content: "|";
		display: inline-block;
		font-size: 1.5em;
		-webkit-transform: skew(-35deg);
		-moz-transform: skew(-35deg);
		-o-transform: skew(-35deg);
		margin-right: 10px;
	}
}




















/*---------------------------

	TAB＆SP
	トップコンテンツメニュー

---------------------------*/
@media only screen and (max-width: 1024px) {
	.top_con{
		position:fixed;
		top: 0;
		left: 0;
		z-index: 999;
		height: 80px;
		width: 100%;
	}
	.pc_ver{
		display: none !important;
	}
	.tab_ver{
		display: block !important;
		background: #fff;
		height: 80px;
		line-height: 80px;
		color: #fff;
		padding:0;
		width: 100%;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
	}
	.tab_ver *{
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
	}

	/* box02 search_btn_area
	------------------------*/
	.tab_ver .box02 .search_btn_area .search_btn{
		padding-right: 80px;
		padding-top: 22px;
		height: 80px;
		line-height: 80px;
		text-align: right;
		display:none;
	}
	.tab_ver .box02 .search_btn_area .search_btn img{
		transition: .3s;
	   cursor: pointer;
	   height: 35px;
	}
	.tab_ver .box02 .search_btn_area .search_btn img:hover{
		opacity: 0.6;
	}

	/* ボタン
	------------------------*/
	.sp_btn{
		background:#000;
		display:block;
		padding:10px 25px;
		position:absolute;
		top:0;
		right:0;
		cursor: pointer;
		z-index: 999;
	}
	.sp_btn p,
	.sp_btn span {
		display: inline-block;
		transition: all .4s;
	}
	.sp_btn p {
		position: relative;
		width:30px;
		height:60px;
	}
	.sp_btn span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #fff;
		border-radius: 4px;
	}
	.sp_btn span:nth-of-type(1) {
    top: 13px;
	}
	.sp_btn span:nth-of-type(2) {
		top: 24px;
	}
	.sp_btn span:nth-of-type(3) {
		bottom: 21px;
	}
  .sp_btn em {
    position: absolute;
    bottom: -1px;
    left: -5px;
    color: #fff;
    font-size: 14px;
    line-height: 1;
    display: block;
    font-weight: normal;
    width: 130%;
  }
	/* ボタン閉じる動き（エフェクト対応） */
	.sp_btn.active span:nth-of-type(1) {
		-webkit-transform: translateY(6px) rotate(-45deg);
		transform: translateY(6px) rotate(-45deg);
	}
	.sp_btn.active span:nth-of-type(2) {
		opacity: 0;
	}
	.sp_btn.active span:nth-of-type(3) {
		-webkit-transform: translateY(-17px) rotate(45deg);
		transform: translateY(-17px) rotate(45deg);
	}
	/* 中身
	------------------------*/
	.nav_inner{
		z-index: 999;
		position:fixed;
		top:80px;
		right:-100%;
		width:100%;
		height:calc( 100vh - 80px );
		background-color:rgba( 22, 22, 22, 1 );
		transition: .5s;
		z-index:9999;
		overflow-y: scroll;
		padding: 50px 0 0;
		box-sizing:border-box;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
	}
	.nav_inner.open{
		right:0;
	}
	/* 中身 初期設定 */
	.nav_inner{
		font-size: 1.083em;/*(13)*/
		line-height: 25px;
	}
	.nav_inner img{width:auto;}
	.nav_inner a{text-decoration:none;}

	/* 中身 詳細
	------------------------*/
	/*box01*/
	.nav_inner .box01{
		width: 100% !important;
		padding:0 15px;
		float: none;
		text-align: center;
	}
	.nav_inner .box01 li{
		display: inline-block;
		margin-bottom: 20px;
	}
	.nav_inner .box01 li + li{
		margin-left: 10px;
	}
	.nav_inner .box01 li a{
		display: block;
		color: #fff;
		border: 1px solid #fff;
		padding: 8px 35px 7px 10px;
		background: #000 url(/arthall/images/link_icon_btn01.png) no-repeat right 12px center;
		letter-spacing: 1px;
	}
	/*menu_nav*/
	.nav_inner .menu_nav{
		padding: 0 15px;
		font-size: 1.231em;
		line-height: 130%;
	}
	.nav_inner .menu_nav li{
		margin-bottom: 10px;
	}
	.nav_inner .menu_nav li a,
	.nav_inner .menu_nav li span.dropbtn{
		background: #fff;
		position: relative;
		display: block;
		color: #000;
		text-align: left;
		padding: 13px 50px 13px 20px;
	}
	.nav_inner .menu_nav li a:after{
		display: block;
	   content: "";
	   width: 10px;
	   height: 10px;
	   border-top: 2px solid #000;
	   border-right: 2px solid #000;
	   transform: rotate(45deg);
	   position: absolute;
	   right: 20px;
	   top: 50%;
		margin-top: -5px;
	}
	.nav_inner .menu_nav li.drop span.dropbtn:before {
		position: absolute;
	   right: 15px;
	   top: 50%;
	   margin-top: -10px;
	   width: 15px;
	   height: 2px;
	   background-color: #000;
	   display: inline-block;
	   transition: all .4s;
	   content: "";
	   -webkit-transform: translateY(10px) rotate(0deg);
	   transform: translateY(10px) rotate(0deg);
	}
	.nav_inner .menu_nav li.drop span.dropbtn:after {
		position: absolute;
	   right: 13px;
	   top: 50%;
	   margin-top: 1px;
	   width: 18px;
	   height: 1px;
	   background-color: #000;
	   display: inline-block;
	   transition: all .4s;
	   content: "";
	   -webkit-transform: translateY(0) rotate(90deg);
	   transform: translateY(0) rotate(90deg);
	}
	.nav_inner .menu_nav li.drop span.dropbtn.open:after {
		content: normal;
	}
	.nav_inner .menu_nav .dropbox{
		display: none;
	}
	.nav_inner .menu_nav .dropbox li{
		margin-bottom: 0;
		border-top: 1px solid #2b2b2b;
	}
	.nav_inner .menu_nav .dropbox a{
		line-height: 1;
	}
	/*linkbt01*/
	.nav_inner .linkbt01{
		margin: 20px 0;
		padding: 0 15px;
	}
	.nav_inner .linkbt01 a{
		background: #000;
		display: block;
		position:relative;
		font-size: 1.077em;
		color: #fff;
		text-align: center;
		padding: 15px 15px;
		font-weight: normal;
		line-height: 30px;
	}
	.nav_inner .linkbt01 a:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: 5px transparent solid;
  border-bottom: 5px #fff solid;
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  right: 0;
  bottom: 2px;
	}
  .nav_inner .linkbt001{
  text-align: center;
  }
  .nav_inner .linkbt001 a{
  background: none;
  font-size:1em;
  width: 66%;
  margin:0 auto;
  padding:8px 25px;
  line-height: inherit;
  font-size: 1.077em;
  border: 2px solid #fff;
  border-radius: 50px;
  background: url(/arthall/images/link_icon_btn02.png) no-repeat right 20px center;
  background-size: 15px auto;
  margin-top: 10px;
  }
  .nav_inner .linkbt001 a:before {
  content: normal;
  }
	.nav_inner .linkbt002 a{
		display: table;
		width: 100%
	}
	.nav_inner .linkbt002 p{
		display: table-cell;
		vertical-align: middle;
		height: 150px;
	}
	.nav_inner .linkbt002 p.img img{
		max-height: 170px;
		width: auto;
	}
	.nav_inner .linkbt002 p.text{
		padding-left: 10px;
		font-size: 1.154em;
	}
	.nav_inner .linkbt002 p.text span{
		font-size: 0.567em;
		color: #727272;
		letter-spacing: 0.6px;
		padding: 5px 0 0;
		display: inline-block;
		line-height: 1;
	}
	.nav_inner .linkbt003 a{
		font-size: 1.231em;
	}
	/*linkbt02*/
	.nav_inner .linkbt02{
		width: 60%;
		border: 2px solid #fff;
		border-radius: 50px;
		margin: 20px auto;
		display: block;
		color: #fff;
		text-align: center;
		padding: 8px 25px;
		background: url(/arthall/images/link_icon_btn02.png) no-repeat right 20px center;
		background-size: 15px auto;
		letter-spacing: 0.5px;
		font-size: 1.077em;
	}
	/*モーダル中身*/
	.nav_inner .modal .inner {
		position:fixed;
		z-index:99999;
		top: 50%;
		left:50%;
		transform:translate(-50%,-40%);
		background:#fff;
		padding: 30px 15px 20px;
		text-align: center;
		max-width: 85%;
		width: 100%;
	}
	.nav_inner .modal p.ttl{
		font-size: 1.385em;
		margin-bottom: 15px;
    color: #000;
	}
	.nav_inner .modal p.ttl:before{
		content: url(/arthall/images/common/sns_icon01.png);
	   line-height: 1;
	   vertical-align: -webkit-baseline-middle;
	   margin-right: 10px;
	}
	.nav_inner .modal p.ttl.fb:before{
		content: url(/arthall/images/common/sns_icon02.png);
	}
	.nav_inner .modal ul {
		margin-bottom: 40px;
		width: 100%;
		font-size: 1.231em;
	}
	.nav_inner .modal ul li {
		width: calc( 33% - 6px );
		float: left;
	}
	.nav_inner .modal ul.fb li {
		width: 100%;
		float: none;
		margin-bottom: 0px !important;
	}
	.nav_inner .modal ul li + li{
		margin-left: 10px;
	}
	.nav_inner .modal ul li + li:before{
		content:normal;
	}
	.nav_inner .modal ul li a {
		display: block;
		border: 1px solid #000;
		color: #000;
		text-decoration: none;
		letter-spacing: 0.5px;
		font-size: 1em;
		padding: 8px 30px 8px 10px;
		background:url(/arthall/images/common/icon01.png) no-repeat right 12px center;
		background-size: 15px auto;
	}
	.nav_inner .modal ul li a:hover{
		opacity: 0.6;
	}
	.nav_inner .modal .inner .modalClose {
		cursor:pointer;
  color: #000 !important;
	}
	.nav_inner .modal .inner .modalClose:before{
		content: "×";
	}
	/*アニメーション設定*/
	@keyframes modal{
		0% {top:-100%}
		100% {top:50%}
	}
	@keyframes modalClose {
		0% {top:50%}
		100% {top:100%}
	}
	/*box02*/
	.nav_inner .box02{
		width: 100%;
	   float: none;
	   text-align: left;
		margin: 40px 0 10px;
		padding: 0 15px;
	}
	.nav_inner .box02 li{
		width: 50%;
		float: left;
		margin-bottom: 10px;
	}
	.nav_inner .box02 li a{
		display: block;
		position: relative;
		color: #fff;
		padding: 0  10px 0 25px;
		line-height: 23px;
	}
	.nav_inner .box02 li a:before{
		display: block;
		content: "";
		width: 6px;
		height: 6px;
		border-top: 2px solid #727272;
		border-right: 2px solid #727272;
		transform: rotate(45deg);
		position: absolute;
		left: 5px;
		top: 7px;
	}
	/*box03*/
	.nav_inner .box03 li{
		width: calc( 100% / 3 );
		float: left;
	}
	.nav_inner .box03 li a{
		display: table;
		width: 100%;
		height:;
		font-weight:normal;
		background: #0d0d0d;
	}
	.nav_inner .box03 li a span{
		display:table-cell;
		text-align: center;
		vertical-align: middle;
	   color: #fff;
		font-size: 0.913em;
	   background:url(/arthall/images/link_icon_btn02.png) no-repeat right 10px center;
		background-size: 15px auto;
		line-height: 30px;
		font-weight:normal;
		padding: 25px 30px;
	 }
	.nav_inner .box03 li:nth-child(2) a{
		border-left: 2px solid #161616;
		border-right: 2px solid #161616;
		background: #000000;
	}
/*css終了*/
}
@media all and (min-width: 767px) and (max-width: 1024px) {
	.top_con .box01 span img {
  padding: 10px 0 0 10px;
  }
}
@media only screen and (max-width: 767px) {
	.top_con{
		height: 40px;
	}
	.tab_ver{
		height: 40px;
		line-height: 40px;
		padding:0;
	}
	.top_con .box01 {
	  width: calc( 100% - 100px );
	  height: 40px;
	  display: table;
	}
	.top_con .box01 span{
		display: table-cell;
		vertical-align: middle;
	}
  /*
	.top_con .box01 span img {
	  max-height: 40px;
	  width: auto;
	  max-width: 100%;
	}
  */
	.top_con .box01 span img {
	  max-height: 30px;
	  width: auto;
	  max-width: 100%;
    margin: 5px 0 0 5px;
	}
	.tab_ver .box02 .search_btn_area{
		display: none !important;
	}
	.sp_btn {
	  padding: 5px 10px;
	}
	.sp_btn p {
	  width: 20px;
	  height: 30px;
	}
	.sp_btn em{
		font-size: 10px;
    width: 140%;
	}
	.sp_btn.active em{
		letter-spacing: 0.5px;
	}
	.sp_btn span {
	  height: 2px;
	}
	.sp_btn span:nth-of-type(1) {
	  top: 3px;
	}
	.sp_btn span:nth-of-type(2) {
	  top: 9px;
	}
	.sp_btn span:nth-of-type(3) {
	  bottom: 13px;
	}
	.sp_btn.active span:nth-of-type(3) {
	  -webkit-transform: translateY(-6px) rotate(45deg);
	  transform: translateY(-6px) rotate(45deg);
	}
	.nav_inner {
	  top: 40px;
	  height: calc( 100% - 40px );
	}
	div.cf div.nfr,
	div.cf div.nfl{
		float: none;
		width: 100%;
	}
	div.cf div.fr,
	div.cf div.fl{
		float: none;
	}
/*css終了*/
}

/* iphoneSE */
@media only screen and (max-width: 320px) {
  .br_only{
  display: none;
  }
	.nav_inner .menu_nav{
		padding: 0 15px;
  /*
		font-size: 1.231em;
  */
		line-height: 125%;
		font-size: 1em;
	}
  .nav_inner .box01 li{
  display: block;
  }
  .nav_inner .box01 li + li{
  margin-top: 10px;
  margin-left: 0;
  }
  .nav_inner .site_nav li a{
  font-size: 1.167em;
  }

	.nav_inner .box03 li{
		width: 100%;
		float: none;
  margin-top: 2px;
	}
	.nav_inner .box03 li a{
  font-size: 1.167em;
  }
	.nav_inner .box03 li a span{
		padding: 15px 20px;
  }
}


@media only screen and (max-width: 767px) {
  a[href^="tel"]{
    color:inherit;
    text-decoration:none;
  }
}



/*---------------------------

  検索結果

---------------------------*/
.yj100per-2 #wrapper {
  max-width: 750px;
}
