@charset "UTF-8";
/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
/*
一つ目は、box-sizing用のmixinの定義。
Sassを使用すると、変数（ここでは$type）が使えたり、ベンダープレフィックスをコード側に記述することもなくなります。
 */
/*
div {
 @include box-sizing(border-box);
}
 */
/*
不透明度はモダンブラウザ用にはopacityで、IE8以下用にはfilterを使用して定義します。
 */
/*
div {
 @include opacity(0.5);
 }
 */
/*
カラム幅の設定はmixinを使った最も良い例の一つです。
 */
/*
div {
 @include column-width(150px);
 }
 */
/*
divは通常長方形ですが、これを利用すると円形に変えることができます。
 */
/*
div {
 @include circle();
 }
 */
/*
mixinはプログレッシブエンハンスメントでも活躍します。
IE8などの古いブラウザはpx、モダンブラウザはremに上書きしてfont-sizeを設定します。
 */
/*
div {
 @include font-size(14px);
 }
 */
/*
このmixinはベンダープレフィックスを考えずに、ボックスシャドウを利用できるようにします。
 */
/*
div {
 @include box-shadow(8px, 8px);
 }
 */
/*
mixinはコードをシンプルにします。
要素を移動させる座標（X軸）を設定します。
 */
/*
div {
 @include xPos(50px);
 }
 */
/*
天地の中央に要素を配置するスニペットもmixinでは簡単です。
 */
/*
div {
 @include vertical-align();
 }
 */
/*
ブラウザごとに記述が異なる時、Sassのmixinは非常に素晴らしい効果を発揮します。
 */
/*
div {
 @include flexbox();
 }
 */
/*
displayのプロパティをflexに設定する時のモダンブラウザの旧仕様にも対応した記述方法です。
 */
/*
div {
 @include flex(1, 2);
 }
 */
/*
flexと同様に、旧仕様にも対応したflex-orderの設定。
 */
/*
div {
 @include flex-order(3);
 }
 */
/*
mixinでは、ifやelseなどの条件も使用できます。
 */
/*
div {
 @include flex-direction(column);
 }
 */
/*
コードは可能な限りシンプルにしておくべきです。しかし必要がある時はコードが長くなってしまうことがあります。このmixinは3つの値を指定するだけで、すべてのブラウザで線形（水平・垂直）と円形の美しいグラデーションを作りだします。
 */
/*
div {
 @include gradient(#ff00ff, #ff00cc, vertical);
 }
 */
/*
フラットスタイルによく使用されるゴーストボタンのmixinです。
ホバー時に繊細なアニメーションが適用されるこのボタンの作り方は、下記を参考に。
 */
/*
div {
 @include ghost-button(“Trebuchet”, 12px, #ffffff, 5px, #34dec6, 4px, 300ms, #000000 );
 }
 */
/*
Sass 3.2から使える「@content」でブロックコンテンツも扱え、キーワードによるブレイクポイントを設定するこができます。ブレイクポイントはデバイスに基づいて設定しないほうがいいでしょう。
 */
/*
div {
 margin:5em;
 @include break-point(mobile)
 {
 margin:2em;
 }
 }
 */
/*
 */
/*
@mixin sprite-background($name,$sprite,$img) {
  background-image: $img;
  background-position: sprite-position($sprite, $name);
  background-repeat: no-repeat;
  display: inline-block;
  height: image-height(sprite-file($sprite, $name));
  width: image-width(sprite-file($sprite, $name));
}
*/
/*
$sprites-icon: sprite-map("sprite/icon/*.png");
$sprites-img-icon:sprite-url($sprites-icon);

↑どこかで一回指定しておけばOK

i{
	content:"";
	@include sprite-background(arrow-1,$sprites-icon,$sprites-img-icon);
	display:block;
	position:absolute;
	top:0;
	left:0;
}
 */
/*
計算式

横幅を px → % へ変換する計算式は次のようになります。（親要素幅はmargin、padding、borderを含まない値）

％指定したい要素の横幅(px) ÷ 親要素の横幅(px) × 100

例えば 300px 幅の要素の親が 960px だった場合次のような計算です。

300 ÷ 960 × 100 = 31.25 → width: 31.25%

定義

上記の式から mixin は以下のように定義します。第一引数に、%指定したい要素の親ボックスの横幅（px）、第二引数に要素の横幅（px）を指定します。
 */
/*

.example の横幅を % 指定したいとします。.example の親要素の横幅が 960px 、.example が 300px とすると以下のように呼び出します。


.example{
    @include widtnPercent(960, 300);
}
 */
/*
計算式

高さを px → % へ変換する計算式は次のようになります。（親要素高さはmargin、padding、borderを含まない値）

％指定したい要素の高さ(px) ÷ 親要素の高さ(px) × 100

定義

上記の式から mixin を以下のように定義します。第一引数に、%指定したい要素の親ボックスの高さ（px）、第二引数に要素の高さ（px）を指定します。
 */
/*

.example の高さを % 指定したいとします。.example の親要素の高さが 500px、.example が 300px とすると以下のように呼び出します。


.example{
    @include heightPercent(500, 300);
}
 */
/*
計算式

margin を px → % へ変換する計算式は次のようになります。（親要素幅はmargin、padding、borderを含まない値）

％指定したい要素のmargin(px) ÷ 親要素の横幅(px) × 100

定義

上記の式から mixin を以下のように定義します。第一引数に、%指定したい要素の親ボックスの幅（px）、第二引数にmargin-top（px）、第三引数に margin-right、第四引数に margin-bottom、第五引数に margin-left を指定します。
 */
/*

.example の margin を % 指定したいとします。.example の親要素の横幅が 500px として、上下を 20px 左右に 5px の margin を付けたいという場合以下のように呼び出します。


.example{
    @include marginPercent(500, 20, 5, 20, 5);
}
 */
/*
計算式

padding を px → % へ変換する計算式は次のようになります。（親要素幅はmargin、padding、borderを含まない値）

％指定したい要素の padding(px) ÷ 親要素の横幅(px) × 100

定義

上記の式から mixin を以下のように定義します。第一引数に、%指定したい要素の親ボックスの幅（px）、第二引数にpadding-top（px）、第三引数に padding-right、第四引数に padding-bottom、第五引数に padding-left を指定します。
 */
/*

.example の padding を % 指定したいとします。.example の親要素の横幅が 500px として、上下を 20px 左右に 5px の padding を付けたいという場合以下のように呼び出します。


.example{
    @include paddingPercent(500, 20, 5, 20, 5);
}
 */
/*
left right の計算式

left right の値を px → % へ変換する計算式は次のようになります。（親要素幅は padding を含む値。margin、border は含まない）

％指定したい要素の left 又は right 値(px) ÷ 親要素の横幅(px) × 100

top bottom の計算式

top bottom の値を px → % へ変換する計算式は次のようになります。（親要素高さは padding を含む値。margin、border は含まない）

％指定したい要素の top 又は bottom 値(px) ÷ 親要素の高さ(px) × 100


定義

上記の式から mixin を以下のように定義します。第一引数に、%指定したい要素の親ボックスの高さ又は幅(px)、第二引数に 絶対値(px) を指定します。
 */
/*

.example を position: absolute し、left と top で位置指定したいとします。.example の親要素の横幅が 500px、高さが 300px とします。その中で .example の位置を left: 50px / top: 50px に指定したい場合以下のように呼び出します。


.example{
    position: absolute;
    @include posiLeftPercent(500, 50);
    @include posiTopPercent(300, 50);
}





上記と同じ条件で .example の位置を right: 50px / bottom: 50px に指定したい場合は以下のように呼び出します。

.example{
    position: absolute;
    @include posiRightPercent(500, 50);
    @include posiBtmPercent(300, 50);
}
 */
/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
/* line 3, ../sass/_base.scss */
html {
  color: #000;
  font-size: 1em;
  line-height: 1.4;
}

* {
	margin: 0px;
	padding: 0px;
	font-size: 1em;
	font-weight: normal;
	line-height: 150%;
	color: #000;
}

span.shidden { visibility: hidden; }

div.clear {
	clear: both;
	height: 0px;
	overflow: hidden;
	font-size: 0px;
	line-height: 0px;
}
hr {
	visibility: hidden;
	border: 0px;
	height: 0px;
	font-size: 0px;
	line-height: 0px;
	display: none;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:1em;line-height:1em;
	font-weight:normal;
}



::-moz-selection {
  text-shadow: none;
}


::selection {
  text-shadow: none;
}


textarea {
  resize: vertical;
}

/* ===== Initializr Styles ==================================================
   Author: Jonathan Verrecchia - verekia.com/initializr/responsive-template
   ========================================================================== */

body {
  font: 16px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  padding: 50px 0 0;
  position: relative;
  margin: 0;
}


img {
  width: 100%;
  vertical-align: bottom;
}
/*a:active{
text-decoration:none;
border-width:0px;
border-style:none;
border-color:transparent;
outline: none;
}
a {outline:none;}
a:focus{
	outline: none;
}
area{
  border:none;
  outline:none;
}
area:active{outline:none;}*/


.header-main {
  padding: 0;
  margin: 0 auto;
	width:100%;max-width:640px; background-color:#fff;
}

.footer-main {
  padding: 0;
  margin: 0 auto;
	width:100%;
}


.header-title {
  padding: 0;
  margin: 0;
}

@media only screen and (min-width: 640px) {
.tbvisible {display:none;}
.header-buttons h1 a{display:block; width:333px; height:50px;background:url(../img/nv_01.png) 0 0 no-repeat;}
}

@media only screen and (max-width: 639px) {
.pcvisible {display:none;}
.header-buttons h1 a{display:block; width:160px; height:50px;background:url(../img/logo.gif) 0 0 no-repeat; background-size:165px;}
}

.logopc{width:333px;}
.logotb{width:165px;}

.hnv{width:160px;float:right;font-size:0;}
.hnv > li{float:left;  display: block;}
.hnv img{width:105px;}
.header-buttons h1{display:block;float:left;}
.header-buttons h1 a{display:block;}

.header-buttons {
/*background: url(../img/head-bar.gif) 0 0 repeat-x;*/
  font-size: 0;
  display: table;
  table-layout: fixed;
  width: 100%;
  box-sizing: border-box;
　list-style-type:none;
}

.footer-buttons { background:#fff;
  font-size: 0;
  display: table;
  table-layout: fixed;
  width: 100%;
  box-sizing: border-box;
　list-style-type:none;
}

.header-buttons > li {
  display: block; float:left;
  padding: 0 /*1.5%*/;
}

.footer-buttons > li {
  display: block; float:left;
  margin: 5px 0 5px 10px ;
/*  display: table-cell;
  padding: 0 1.5%;
  max-width: 50px;*/
}

.header-buttons .btn .arrow-right {
  margin-left: 6px;
}

.header-buttons .btn {
  height: 50px;
  width: 53px;
}


.header-menu-container {
  overflow: hidden;
  display: none;
}

.footer-menu-container {
  overflow: hidden;
  display: none;
}


.header-container {
/*background: url(../img/nv.png)  center 0 repeat-x;*/
 /* border-bottom: 1px solid #d7a9d0;*/
/*background-size:1150px 60px;*/
  height: 50px;
  top: 0px;
  width: 100%;
  z-index: 100;
margin:0 auto; padding:0;
  position: fixed; font-size:0;
}

/* line 103, ../sass/_base.scss */
.menu-list-1 {
  margin: 0px 0 0;
  padding: 0 ;
  list-style: none;
  background-color: #fff /*#d7a9d0*/;
  overflow: hidden;
  text-align: center;
}
/* line 109, ../sass/_base.scss */
.menu-list-1 > li {
  background-color: #f8f0f9;
 margin-bottom:1px;
  box-sizing: border-box;
}
/* line 115, ../sass/_base.scss */
.menu-list-1 > li:nth-child(even) {
  background-color: #fbf7fc;

}
/* line 120, ../sass/_base.scss */
.menu-list-1 .request {
  background-image: url(../images/bg-menu.png);
  background-size: cover;
  color: #fff;
}
/* line 125, ../sass/_base.scss */
.menu-list-1 + .menu-list-1 {
  margin-top: 0;
}

/* line 130, ../sass/_base.scss */
.menu-btn {
  display: block;
/*  background: #fff;*/
  text-decoration: none;
  font-size: 1em;
  height: 50px;
  line-height: 50px;
  position: relative;
}
/* line 139, ../sass/_base.scss */
.menu-btn.icon-new:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 6px;
  margin: auto 0;
}


.menu-list-f {font-size: 14px;
  margin: 0px 0 0;
  padding: 0;
  list-style: none;
  background: rgba(255,255,255,0.95);
  overflow: hidden;
	border-top:1px solid #eee;
}

.fnv{clear:both;border-left:1px solid #eee; margin:5em 0;}

.menu-list-f > li {
  width: 33.333%;
  float: left;
  text-align: center;
  margin: 1px 0 0 0;
	border-right:1px solid #eee;
	border-bottom:1px solid #eee;
  box-sizing: border-box;
}



.menu-list-f + .header-menu-container {
  margin-top: 0;
}

.menu-btn-f {
  display: block;
  text-decoration: none;
  font-size: 12px;
  height: 50px;
  line-height: 50px;
  position: relative;
}

.menu-btn-f.icon-new:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 6px;
  margin: auto 0;
}



.icon-new:before {
  content: "";
  display: block;
  background: url(../images/icon/icon-new.png) 0 0 no-repeat;
  width: 23px;
  height: 23px;
  background-size: 23px 23px;
}


a.menu-btn {
  color: #333333;
}

a.menu-btn.active {
  text-decoration: underline;
}


span.menu-btn {
  color: #B8CBBB;
}



.footer-tel {
  text-align: center;
  font-size: 0;
  line-height: 0;
}


.footer-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #000;
}

.footer-list > li {
  border-bottom: 1px solid #000;
  line-height: 0;
}


.footer-company {
  overflow: hidden;
  width: 300px;
  margin: 0 auto;
  display: table;
}

.footer-company dt, .footer-company dd {
  vertical-align: middle;
  display: table-cell;
  height: 40px;
  text-align: left;
  box-sizing: border-box;
}

.footer-company dt {
  width: 110px;
  padding: 0 0 0 20px;
}


.copyright {
  padding: 10px 0 18px;
  font-size: 8px;
  text-align: center;
}


.main-photo {
  display: none;
  z-index: -10;
}

.main-photo img {
  width: 100%;
}

.main-photo:first-child {
  display: block;
  z-index: 0;
}


.main-photo-cover {
  position: relative;
  width: 100%;
  overflow: hidden;
}


.main-photo-area {
  overflow: hidden;
}

.main-photo-area .main-photo {
  position: absolute;
  top: 0;
  width: 100%;
}

.main-photo-area .main-photo:first-child {
  position: relative;
}

.main-photo-area .main-photo p {
  margin: 0;
  padding-right: 10px;
  margin-top: 2px;
  font-size: 10px;
  line-height: 10px;
  text-align: right;
}


.main-photo-info {
  position: absolute;
  bottom: 12px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  height: 25px;
  line-height: 25px;
  text-align: center;
}

.main-photo-info img {
  vertical-align: middle;
}


.information-list {
  margin: 0 auto;
  overflow: hidden;
  padding: 0;
}

.information-list > dt {
  width: 6em;
  padding: 10px 0 0;
  display: table-cell;
}

.information-list > dd {
  padding: 10px 0 0;
  display: table-cell;
}




/* float-bnr */

#contents {
  position: relative;
  width: 100%;
}


#side {
  position: absolute;
  top: 32%;
  right: 10px;
  z-index: 9999;
  width: 15%;
}


.closearea {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 20px;
  height: 20px;
  display: block;
}



.wrapper {
  padding-left: 10px;
  padding-right: 10px;
  box-sizing: border-box;
}

/*---------------------------------------
images
---------------------------------------*/

.image_full {
  width: 100%;
  height: auto;
}

/*---------------------------------------
background
---------------------------------------*/

.bg-theme {
  background-color: #fff;
}

/* line 51, ../sass/main.scss */
.bg-contents-1 {
  background-image: url("../images/bg-contents-1.jpg");
  background-repeat: repeat;
  background-position: 0 0;
  background-size: cover;
}

/*---------------------------------------
padding
---------------------------------------*/

.pt6 {
  padding-top: 6px;
}


.pt7 {
  padding-top: 7px;
}


.pt10 {
  padding-top: 10px;
}


.pt18 {
  padding-top: 18px;
}


.pt35 {
  padding-top: 35px;
}


.pt20 {
  padding-top: 20px;
}


.pt30 {
  padding-top: 30px;
}


.pt40 {
  padding-top: 40px;
}


.pt24 {
  padding-top: 24px;
}


.pb10 {
  padding-bottom: 10px;
}


.pb18 {
  padding-bottom: 18px;
}


.pb20 {
  padding-bottom: 20px;
}


.pb30 {
  padding-bottom: 30px;
}


.pb25 {
  padding-bottom: 25px;
}


.pl5 {
  padding-left: 5px;
}


.pl25 {
  padding-left: 25px;
}


.pr25 {
  padding-right: 25px;
}

/*---------------------------------------
margin
---------------------------------------*/

.m0 {
  margin: 0;
}


.mt20 {
  margin-top: 20px;
}
.mt70 {
  margin-top: 70px;
}
.mt100 {
  margin-top: 100px;
}


.mb30 {
  margin-bottom: 30px !important;
}

/*---------------------------------------
float
---------------------------------------*/

.fl-l {
  float: left;
}


.fl-r {
  float: right;
}

/*---------------------------------------
color
---------------------------------------*/

.color-white {
  color: #FFF;
}

/*---------------------------------------
text-aling
---------------------------------------*/

.text-left {
  text-align: left;
}


.text-right {
  text-align: right;
}


.text-center {
  text-align: center;
}

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

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

.indent {
  text-indent: -1em;
  padding-left: 1em;
}

/*---------------------------------------
font-size
---------------------------------------*/

.fs8 {
  font-size: 8px;
}


.fs9 {
  font-size: 9px;
}


.fs10 {
  font-size: 10px;
}

/*---------------------------------------
display
---------------------------------------*/

.table {
  display: table;
}


.table-cell {
  display: table-cell;
}

/* float-bnr */

#contents {
  position: relative;
  width: 100%;
}


#side {
  position: absolute;
  top: 32%;
  right: 10px;
  z-index: 99;
  width: 15%;
}


.side-bnr-1 {
  margin-top: 10px;
}


.closearea {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 20px;
  height: 20px;
  display: block;
}


.test {
  position: relative;
}

/*---------------------------------------
sprite
---------------------------------------*/

.arrow-right {
  width: 8px;
  height: 9px;
  background-image: url('../images/sprite-s53f3ffa0a0.png');
  background-position: -21px -137px;
  background-repeat: no-repeat;
  -moz-background-size: 43px auto;
  -o-background-size: 43px auto;
  -webkit-background-size: 43px auto;
  background-size: 43px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}


.icon-tel-1 {
  width: 21px;
  height: 35px;
  background-image: url('../images/sprite-s53f3ffa0a0.png');
  background-position: 0 -137px;
  background-repeat: no-repeat;
  -moz-background-size: 43px auto;
  -o-background-size: 43px auto;
  -webkit-background-size: 43px auto;
  background-size: 43px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}


.icon-map-1 {
  width: 42px;
  height: 35px;
  background-image: url('../images/sprite-s53f3ffa0a0.png');
  background-position: 0 -67px;
  background-repeat: no-repeat;
  -moz-background-size: 43px auto;
  -o-background-size: 43px auto;
  -webkit-background-size: 43px auto;
  background-size: 43px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}


.icon-menu-1 {
  width: 53px;
  height: 50px;
  background-image: url('../img/nv2.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  -moz-background-size: 53px auto;
  -o-background-size: 53px auto;
  -webkit-background-size: 53px auto;
  background-size: 53px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;

}

.icon-menu-1f {
  width: 50px;
  height: 50px;
  background-image: url('../img/nv-i.gif');
  background-position: 0 7px;
  background-repeat: no-repeat;
  -moz-background-size: 50px auto;
  -o-background-size: 50px auto;
  -webkit-background-size: 50px auto;
  background-size: 50px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}



.icon-request-1 {
  width: 43px;
  height: 33px;
  background-image: url('../images/sprite-s53f3ffa0a0.png');
  background-position: 0 -34px;
  background-repeat: no-repeat;
  -moz-background-size: 43px auto;
  -o-background-size: 43px auto;
  -webkit-background-size: 43px auto;
  background-size: 43px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}


.icon-reserve-1 {
  width: 42px;
  height: 35px;
  background-image: url('../images/sprite-s53f3ffa0a0.png');
  background-position: 0 -102px;
  background-repeat: no-repeat;
  -moz-background-size: 43px auto;
  -o-background-size: 43px auto;
  -webkit-background-size: 43px auto;
  background-size: 43px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
}


.btn {
  display: inline-block;
  vertical-align: middle;
  border-radius: 3px;
  position: relative;
  font-size: 11px;
  border-style: none;
  line-height: 1.2;
  box-sizing: border-box;
}


.btn-size-48x30 {
  width: 48px;
  height: 30px;
}


.btn-size-30x30 {
  width: 30px;
  height: 30px;
}


.btn-size-x32 {
  width: 21.77419%;
  height: 45px;
}


.btn-icon-vmidle,
.btn-text-vmidle {
  position: absolute;
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
}


.btn-request .arrow-right {
  position: absolute;
  top: 50%;
  margin-top: -4px;
}

.btn-request .btn-text-request {
  padding: 2px 0 2px 20px;
}


.btn-icon-center {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}


.btn-orenge {
  background-color: #EA5810;
  color: #FFF;
  text-decoration: none;
}


.btn-green {
  background-color: #009FB9;
  color: #FFF;
  text-decoration: none;
}


.btn-green2 {
  background-color: #40a368;
  color: #FFF;
  text-decoration: none;
}


a.btn-green,
a.btn-orenge {
  color: #FFF;
}


.btn-red {
  background-color: #ce1414;
  color: #FFF;
  text-decoration: none;
}

.btn-red.btn-animation {
  animation: btn-animation--red ease-in-out 4 infinite;
  -webkit-animation: btn-animation--red ease-in-out 4s infinite;
}


.footer-container {
  padding-bottom: 0px; width:100%;background:#00418f;
  text-align: center;
  position: fixed;
  bottom: 0;
}


/*.floatingbanner {
  position: fixed;
  bottom: 0;
}*/

@keyframes btn-animation--red {
  0% {
    background: #ce1414;
  }
  50% {
    background: #e4d7d9;
  }
  100% {
    background: #ce1414;
  }
}
@-webkit-keyframes btn-animation--red {
  0% {
    background: #ce1414;
  }
  50% {
    background: #e4d7d9;
  }
  100% {
    background: #ce1414;
  }
}

/*---------------------------------------
border
---------------------------------------*/

.border-bottom {
  border-bottom: 1px solid #000;
}


.border-top {
  border-top: 1px solid #000;
}


.dotline-top {
  border-top: 1px dotted #000;
}

/*---------------------------------------
position
---------------------------------------*/

.position-r {
  position: relative;
}


.position-bottom-right {
  position: absolute;
  bottom: 10px;
  right: 10px;
}


.fixed {
  position: fixed;
}

/*---------------------------------------
list
---------------------------------------*/

.list-wrap {
  max-width: 600px;
  margin: 0 auto;
}


.list {
  margin: 0;
  padding: 0;
  list-style: none;
  width: 100%;
}

.list a {
  position: relative;
  display: block;
}

.list .icon-new:before {
  position: absolute;
  top: 6px;
  right: 6px;
  margin: auto 0;
}

/* ===================
    ALL: Orange Theme
   =================== */
/* ==============
    MOBILE: Menu
   ============== */
/* ==============
    MOBILE: Main
   ============== */
/* ===============
    ALL: IE Fixes
   =============== */
/* ==========================================================================
   Author's custom styles
   ========================================================================== */
/* ==========================================================================
   Media Queries
   ========================================================================== */
@media only screen and (min-width: 480px) {
  /* ====================
      INTERMEDIATE: Menu
     ==================== */
}
@media only screen and (min-width: 768px) {
  /* ====================
      WIDE: CSS3 Effects
     ==================== */
  /* ============
      WIDE: Menu
     ============ */
  /* ============
      WIDE: Main
     ============ */
}
@media only screen and (min-width: 1140px) {
  /* ===============
      Maximal Width
     =============== */
}

/* ==========================================================================
   Print styles
   ========================================================================== */
@media print {

  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }


  a,
  a:visited {
    text-decoration: underline;
  }


  a[href]:after {
    content: " (" attr(href) ")";
  }


  abbr[title]:after {
    content: " (" attr(title) ")";
  }


  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }


  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }


  thead {
    display: table-header-group;
  }


  tr,
  img {
    page-break-inside: avoid;
  }


  img {
    max-width: 100% !important;
  }


  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }


  h2,
  h3 {
    page-break-after: avoid;
  }
}




.foot-info{text-align:center;margin:2em auto 56px;}
.wFull{width:100%;max-width:640px;margin:0 auto; text-align:center;}
.waku1{max-width:600px;margin:0 auto;padding:10px; text-align:center;}




.mt1 {
  margin-top: 1px;
}
.mt08em {
  margin-top: 0.8em;
}
.mt3em {
  margin-top: 3em;
}
.mt100 {
  margin-top: 100px;
}
.mb2em {
  margin-bottom: 2em;
}
.ml4em {
  margin-left: 4em;
}
.tal{text-align:left;}
.tar{text-align:right;}
.fs10{font-size:0.625em;}
.fs12{font-size:0.75em;}
.fs14{font-size:0.875em;}
.fs15{font-size:0.9375em;}
.fs18{font-size:1.125em;}
.lh170{line-height:170%;}





.con{margin:0 auto; text-align:center;width:100%;max-width:640px; }
.main-img{margin:0 auto; border:none; width:100%; max-width:640px;}

.btn:focus{
  outline: none;
}
.btn:hover{
  cursor: pointer;
}




.accordion-box {
    position: relative; max-width:640px;margin:0 auto; text-align:left;
}
.accordion-box label {
    height: 140px; /* グラデーションの高さ */
    cursor: pointer;
    text-align: left;
    font-size: 12px;
    position: absolute;
    bottom: 0;
    width: 100%;

    /* 以下グラデーションは「背景が白」に併せて設定しています */ 
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
}
.accordion-box input:checked + label {
    background: inherit; /* 開いた時には背景グラデーションを消す */
}
.accordion-box label:after {
    content: "続きをよむ"; /* ラベルの文字 */
    letter-spacing: .05em;
    line-height: 2.5rem;
    position: absolute;
    bottom: 20px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    color: #fff;
    background-color: #000;
    width: 18.75rem;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    text-align: center;
}
.accordion-box label:before {
    content: "↓";
    font-weight: 700;
    position: absolute;
    bottom: 30px;
    left: 50%;
    -webkit-transform: translate(-140px, 0);
    transform: translate(-140px, 0);
    background-color: #fff;
    z-index: 1;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}
.accordion-box input {
    display: none;
}
.accordion-box .accordion-container {
    overflow: auto;
    height: 400px; /* 開く前に見えている部分の高さ */
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
	margin:0 10px;

}
.accordion-container p{margin-bottom:4em;}


.accordion-box input:checked + label {
    /* display: none ; 閉じるボタンは要らないとき */
}
.accordion-box input:checked + label:after {
    content: "閉じる";
}
.accordion-box input:checked + label:before {
    content: "↑";
}
.accordion-box input:checked ~ .accordion-container {
    height: auto;
    padding-bottom: 80px; /* 閉じるボタンのbottomからの位置 */
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
}

.midasi{margin-bottom:2em;}
.honbun{text-align:left;line-height:2em; margin:3%;}
.toi{margin:15px 0 30px;}
.toi2 img{width:50%;}
.index-nv{width:90%; max-width:570px; overflow:hidden;margin:50px 0 50px 5%;}
.index-nv li{display:block;float:left;width:50%; margin:30px 0;}
.index-nv-r{width:92%; max-width:640px; overflow:hidden;margin:80px 0 50px 4.3%;}
.index-nv-r li{display:block;float:left;width:22.3%; margin:1.2%;}
.index-nv-r h2{text-align:left; margin:1em 0 1em 10px;line-height:1.4em;}


.beaf {width:100%; max-width:620px; margin:100px 0 0 15px;text-align:left;}
.beaf h3{width:96%; font-size:1.3em; line-height:1.3em;border-bottom:1px #ccc solid;}
.beaf dt {
  clear: both;
  float: left;
  width: 33.87%; 
}
.beaf dd { 
  margin: 0 0 0 38%;
  width: 52.6%; margin-top:3%;
}
.beaf dt img{
  width: 100%;margin-top:15%;
}
.beaf dd img{ 
  width: 100%;
}
.beaf dt h4{
 font-size:0.625em;line-height:2em;
}
.beaf dt p{
 font-size:0.625em;line-height:1.4em;
}
.midasi-sekou{margin:55px 2% 30px; font-size:1.2em; text-align:left;}
.midasi-sekou span{margin-left:1em; font-size:60%; }
.w-full li{margin-bottom:3%;}
.w-full p{margin:0 2%;text-align:left;font-size:0.625em;}
.w414c { width:64.7%;}
.w-full p.w414c {margin-left:18%; width:64.7%;}

.midasi-sekou-i{margin:1em 2% 1.8%; font-size:0.75em; text-align:left;}
.sekou-i{overflow:hidden;text-align:left;}
.sekou-i li{width:47.6%;margin:0 0 1.8% 1.8%; float:left;text-align:right;font-size:0.65em;line-height:1.35;}
.sekou-i li img{width:100%;padding-bottom:1%;}
.sekou-i h3{font-size:0.75em;line-height:1.5;margin:2% 0 5px 2%;}

.koe li{margin-bottom:5em;}
.koe li img{margin-bottom:4em;}
.koe h3{margin:0 2% 0.5em;text-align:left;font-size:0.9em;line-height:1.3;padding-left:3.3em;text-indent: -3.3em;color:#444;}
.koe h3 span{margin-right:1.5em;font-size:0.8em;color:#999;}
.koe p{margin:0 2% 2em;text-align:left;}

.hiyou{text-align:left;width:96%;margin:0 auto;}
.hiyou h3{font-size:1.125em;margin:0.3em auto 1em;}
.hiyou h4{font-size:1.125em;margin:2em auto 0.75em;}
.hiyou dl{font-size:0.875em;}
.hiyou dt {
  clear: both;
  float: left;
  width: 12.5em; 
}
.hiyou dd { 
  margin: 0.2em 0 0.2em 12.5em;
}
.hiyou li{font-size:0.875em; margin-bottom:0.3em;}
.hiyou-chu1{font-size:0.875em; margin:2em 0 5em 1.6em;line-height:1.3em;}
.hiyou-chu2{font-size:0.875em; margin:0.6em 0 1.2em 1.6em;line-height:1.3em;}



.bb{border-bottom:1px #ccc solid;}
.aka{color:#e60012;}
.ao{color:#0085ff;}
.mr05{margin-right:0.4em;}
.fs08{font-size:80%;}



.kaisha{text-align:left;width:96%;margin:0 auto 7em;}
.kaisha-lead{font-size:0.875em;}
.kaisha h3{font-size:1.125em;margin:3em auto 1em;line-height:1.5em;}
.kaisha dl{font-size:0.875em;}
.kaisha dt {
  clear: both;
  float: left;
  width: 9em; 
}
.kaisha dd { 
  margin: 0.5em 0 1em 9em;
}

.taisin{text-align:left;width:96%;margin:0 auto 5em;}
.lead{font-size:0.75em;margin:2em;text-align:left;}
.bgb{text-align:left;background:#e6ffff;padding:4%;margin-bottom:5em;}
.bgb h3{line-height:1.5em; margin-bottom:1em;}
.bgb dl{font-size:0.875em;}
.bgb dt {
  clear: both;
  float: left;
  width: 7em; 
}
.bgb dd { 
  margin: 0.5em 0 1em 7em;
}
.lk{font-size:0.75em;}
.taisin h3{font-size:1.5em;margin:2em 0 1em;}
.taisin h4{font-size:1.125em;margin:1em 0 0.6em;line-height:1.3;}
.taisin img{margin:1em 0;}

.bgb2{text-align:left;background:#e6ffff;padding:4%;margin-bottom:5em;}
.bgb2 h3{line-height:1.5em; margin-bottom:1em;}
.bgb2 h4{line-height:1.5em; margin-bottom:;}
.bgb2 dl{font-size:0.875em;}
.bgb2 dt {margin:0.5em 0 0 1.2em;}
.bgb2 dd { 
  margin: 0 0 1.5em 4em;
}
.bgb2 p{ font-size:0.875em;
  padding: 0 0 1em 4em;
}
.taisin h3.t3{font-size:16px; line-height:27px;margin:1em 0 4em 0;padding:0;}
.taisin h4.t4{font-size:18px; line-height:20px;margin: 0;padding:0;}