/*=================================================================================
    General　
====================================================================================*/
/*----------------------------------------　
  General Layout Style
------------------------------------------*/
* {
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
::selection {
    background:#79d2be; /* Safari */
}
::-moz-selection {
    background:#79d2be; /* Firefox */
}

a {
    color: #303030;
}

h1,h2,h3,h4,h5,h6 {
    margin: 0;
    padding: 0;
    font-size: inherit;
    line-height: inherit;
}
p, pre, ul, ol, li, dl, dt,.topVisual h1 span dd, th, td, address, form{
    margin: 0;
    padding: 0;
    border-radius: 0px;
}
blockquote {
    border-left: 5px solid #f9f9f9;
}
img {
	width: 100%;
}
/* HTML5 */
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary {
    display:block;
}
html {
    font-family: 'Lora', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', "游ゴシック", YuGothic, 'メイリオ', Meiryo, sans-serif;
    font-weight: 500;
    line-height: 1.6;
}
body {
    background-color: #fafafa;
}
.middle,
footer {
  padding-left: 80px;
}

.middle {
    overflow: hidden;
}
@media screen and (max-width: 992px) {
	.middle, footer {
		padding-left: 0px;
}
	.middle {
		padding-top: 72px;
}
}
.lh {
    line-height: normal!important;
}
.pr {
    position: relative;
}
.pa {
    position: absolute;
}
.ps {
    position: static!important;
}
.db {
    display: block;
}
.dib {
    display: inline-block;
}
.di {
    display: inline;
}
.dn {
    display: none;
}
.dtr {
    display: table-row;
}
.bold {
    font-weight: bold
}
.ofh {
    overflow: hidden;
}
.vam {
    vertical-align: middle;
}
.cb {
    clear: both;
}
.cu-h {
	cursor: s-resize;
}
.w100 {
	width: 100%;
}
.bNone {
    border: none!important;
}
.continue {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tShadow {
    text-shadow: 1px 1px 1px #444;
}
.m0{ margin: 0px!important;}
.mb0{ margin-bottom: 0px!important;}
.mb3{ margin-bottom: 3px!important;}
.mb5{ margin-bottom: 5px!important;}
.mb7{ margin-bottom: 7px!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;}
.mb70{ margin-bottom: 70px!important;}
.mb100{ margin-bottom: 100px!important;}
.mb130{ margin-bottom: 130px!important;}
.mb170{ margin-bottom: 170px!important;}
.mt0{ margin-top: 0px!important;}
.mt3{ margin-top: 3px!important;}
.mt5{ margin-top: 5px!important;}
.mt7{ margin-top: 7px!important;}
.mt10{ margin-top: 10px!important;}
.mt15{ margin-top: 15px!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;}
.mt70{ margin-top: 70px!important;}

.pd0{ padding: 0px!important;}
.pd075{ padding: 0.75rem!important;}
.ps-scrollbar-x-rail,.ps-scrollbar-y-rail{
  z-index: 9999;
}

/*---------------------------------
   font-size
-----------------------------------*/
@media only screen and (min-width: 0) {
  html {
    font-size: 62.5%;
  }
  body {
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 992px) {
  html {
    font-size: 62.5%;
  }
  body {
    font-size: 1.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  html {
    font-size: 62.5%;
  }
  body {
    font-size: 1.6rem;
  }
}

@media only screen and (min-width: 0) {
/* 4段,5段,6段 */
  .font10-14,.font10-15,.font10-16{
    font-size: 1.0rem;
  }
  .font11-15,.font11-16,.font11-17{
    font-size: 1.1rem;
  }
  .font12-16,.font12-17,.font12-18{
    font-size: 1.2rem;
  }
  .font13-16,.font13-17,.font13-18,.font13-19{
    font-size: 1.3rem;
  }
  .font14-16,.font14-18,.font14-19,.font14-20{
    font-size: 1.4rem;
  }
  .font15-19,.font15-20,.font15-21{
    font-size: 1.5rem;
  }
  .font16-20,.font16-21,.font16-22,.font16-28{
    font-size: 1.6rem;
  }
  .line-h18-25 {
  	line-height: 1.8rem;
  }
}
/* 600px以降から、100pxごとに1px大きくなる */
@media only screen and (min-width: 600px) {

	.font14-16{
    font-size: calc(0.875em + 2 * (100vw - 600px) / 600);
  }
	.font13-16{
    font-size: calc(0.813em + 3 * (100vw - 600px) / 600);
  }
/* 4段 */
  .font10-14{
    font-size: calc(0.625em + 4 * (100vw - 600px) / 600);
  }
  .font11-15{
    font-size: calc(0.688em + 4 * (100vw - 600px) / 600);
  }
  .font12-16{
    font-size: calc(0.750em + 4 * (100vw - 600px) / 600);
  }
  .font13-17{
    font-size: calc(0.813em + 4 * (100vw - 600px) / 600);
  }
  .font14-18{
    font-size: calc(0.875em + 4 * (100vw - 600px) / 600);
  }
  .font15-19{
    font-size: calc(0.938em + 4 * (100vw - 600px) / 600);
  }
  .font16-20{
    font-size: calc(1.000em + 4 * (100vw - 600px) / 600);
  }
/* 5段 */
  .font10-15{
    font-size: calc(0.625em + 5 * (100vw - 600px) / 600);
  }
  .font11-16{
    font-size: calc(0.688em + 5 * (100vw - 600px) / 600);
  }
  .font12-17{
    font-size: calc(0.750em + 5 * (100vw - 600px) / 600);
  }
  .font13-18{
    font-size: calc(0.813em + 5 * (100vw - 600px) / 600);
  }
  .font14-19{
    font-size: calc(0.875em + 5 * (100vw - 600px) / 600);
  }
  .font15-20{
    font-size: calc(0.938em + 5 * (100vw - 600px) / 600);
  }
  .font16-21{
    font-size: calc(1.000em + 5 * (100vw - 600px) / 600);
  }
/* 6段 */
  .font10-16{
    font-size: calc(0.625em + 6 * (100vw - 600px) / 600);
  }
  .font11-17{
    font-size: calc(0.688em + 6 * (100vw - 600px) / 600);
  }
  .font12-18{
    font-size: calc(0.750em + 6 * (100vw - 600px) / 600);
  }
  .font13-19{
    font-size: calc(0.813em + 6 * (100vw - 600px) / 600);
  }
  .font14-20{
    font-size: calc(0.875em + 6 * (100vw - 600px) / 600);
  }
  .font15-21{
    font-size: calc(0.938em + 6 * (100vw - 600px) / 600);
  }
  .font16-22{
    font-size: calc(1.000em + 6 * (100vw - 600px) / 600);
  }
/* 12段 */
  .font16-28{
    font-size: calc(1.0em + 12 * (100vw - 600px) / 600);
  }
/* line-heiht */
  .line-h18-25 {
  	line-height: calc(1.125em + 10 * (100vw - 600px) / 600);
  }
}
/* 1,200px以上は固定  */
@media only screen and (min-width: 1200px) {

/* 2段 */
	.font14-16{
    font-size: 1.6rem;
  }
 /* 3段 */
	.font13-16{
    font-size: 1.6rem;
  }
/* 4段,5段,6段～ */
  .font10-14{
    font-size: 1.4rem;
  }
  .font11-15,.font10-15{
    font-size: 1.5rem;
  }
  .font12-16,.font11-16,.font10-16{
    font-size: 1.6rem;
  }
  .font13-17,.font12-17,.font11-17{
    font-size: 1.7rem;
  }
  .font14-18,.font13-18,.font12-18{
    font-size: 1.8rem;
  }
  .font15-19,.font14-19,.font13-19{
    font-size: 1.9rem;
  }
  .font16-20,.font15-20,.font14-20{
    font-size: 2.0rem;
  }
  .font16-21,.font15-21{
    font-size: 2.1rem;
  }
  .font16-22{
    font-size: 2.2rem;
  }
  .font16-28{
    font-size: 2.8rem;
  }
  .line-h18-25 {
  	line-height: 2.5rem;
  }
}
.font10{font-size:1.0rem!important;}
.font11{font-size:1.1rem!important;}
.font12{font-size:1.2rem!important;}
.font13{font-size:1.3rem!important;}
.font14{font-size:1.4rem!important;}
.font15{font-size:1.5rem!important;}
.font16{font-size:1.6rem!important;}
.font17{font-size:1.7rem!important;}
.font18{font-size:1.8rem!important;}
.font19{font-size:1.9rem!important;}
.font20{font-size:2.0rem!important;}
.font21{font-size:2.1rem!important;}
.font22{font-size:2.2rem!important;}
.font23{font-size:2.3rem!important;}
.font24{font-size:2.4rem!important;}
.font25{font-size:2.5rem!important;}
.fSpacingSS{letter-spacing: 0.1rem;}
.fSpacingS{letter-spacing: 0.25rem;}
.fSpacingM{letter-spacing: 0.5rem;}
.fSpacingL{letter-spacing: 0.75rem;}
.l-heightS{line-height: 1.3;}
.l-heightM{line-height: 1.5;}
.fsi{font-style: italic};
/*---------------------------------
    form
-----------------------------------*/
input:not([type]).valid, input:not([type]):focus.valid, input[type=text].valid, input[type=text]:focus.valid, input[type=password].valid, input[type=password]:focus.valid, input[type=email].valid, input[type=email]:focus.valid, input[type=url].valid, input[type=url]:focus.valid, input[type=time].valid, input[type=time]:focus.valid, input[type=date].valid, input[type=date]:focus.valid, input[type=datetime-local].valid, input[type=datetime-local]:focus.valid, input[type=tel].valid, input[type=tel]:focus.valid, input[type=number].valid, input[type=number]:focus.valid, input[type=search].valid, input[type=search]:focus.valid, textarea.materialize-textarea.valid, textarea.materialize-textarea:focus.valid {
    border-bottom: 1px solid #26a69a;
    box-shadow: 0 1px 0 0 #bbdebc;
    background: #fdffcd;
}
.input-field label,.input-field label.active {
    font-size: 1.3rem;
}
input:not([type]), input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea {
    font-size: 1.6rem;
}
input:not([type]):focus:not([readonly]),
input[type=text]:focus:not([readonly]),
input[type=password]:focus:not([readonly]),
input[type=email]:focus:not([readonly]),
input[type=url]:focus:not([readonly]),
input[type=time]:focus:not([readonly]),
input[type=date]:focus:not([readonly]),
input[type=datetime]:focus:not([readonly]),
input[type=datetime-local]:focus:not([readonly]),
input[type=tel]:focus:not([readonly]),
input[type=number]:focus:not([readonly]),
input[type=search]:focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #00896c;
  box-shadow: 0 1px 0 0 #00896c;
}

input:not([type]):focus:not([readonly]) + label,
input[type=text]:focus:not([readonly]) + label,
input[type=password]:focus:not([readonly]) + label,
input[type=email]:focus:not([readonly]) + label,
input[type=url]:focus:not([readonly]) + label,
input[type=time]:focus:not([readonly]) + label,
input[type=date]:focus:not([readonly]) + label,
input[type=datetime]:focus:not([readonly]) + label,
input[type=datetime-local]:focus:not([readonly]) + label,
input[type=tel]:focus:not([readonly]) + label,
input[type=number]:focus:not([readonly]) + label,
input[type=search]:focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #00896c;
}

input[type="button"], input[type="reset"], input[type="submit"]{
    outline: none;
}
.btn:not(.waves-light),.btn-large:not(.waves-light) {
    background-color: #fff;
    color: rgba(0, 0, 0, 0.87);
}

/*---------------------------------
    Typography
-----------------------------------*/
.wf-hannari { font-family: "Hannari"; }
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
li.li-hover:hover{
  background: transparent !important;
}

/*---------------------------------
    Color
-----------------------------------*/
.color01{color: #303030;}
.color02{color: #00896c;}
.color03{color: #d19826;}
.color04{color: #b93436;}
.color05{color: #f1f1f1;}
.color06{color: #b9b9b9;}

.bg_color01{background-color: #303030;}
.bg_color02{background-color: #00896c;}
.bg_color03{background-color: #d19826;}
.bg_color04{background-color: #b93436;}

/*----------------------------------------
   footer
------------------------------------------*/
#footer {
    background: #f1f1f1;
}
#footer > div {
	padding: 45px 0;
}
#footer .fSiteName {
    text-align: center;
    font-weight: inherit;
    letter-spacing: 1rem;

    margin: 10px 0 0 10px;
    line-height: normal;
}
#footer .fSubuName {
    font-style: italic;
    text-align: center;
    line-height: 1.5;
    letter-spacing: 0.5rem;
}
#footer .fText {
    display: inline-block;
    height: 85px;
    line-height: 85px;
}
#footer .icon-logo {
    display: inline-block;
    height: 85px;
    line-height: 75px;
    vertical-align: middle;
}
    
#footer .icon-logo .path1:before {
    color: rgb(241, 241, 241);
}
#footer .icon-logo .path2:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path3:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path4:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path5:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path6:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path7:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path8:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path9:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path10:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path11:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path12:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path13:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path14:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path15:before {
    color: rgb(48, 48, 48);
}
#footer .icon-logo .path16:before {
    color: rgb(241, 241, 241);
}
@media only screen and (min-width: 0) {
  .fSiteName {
    font-size: 1.6rem;
  }
  .fSubuName {
	font-size: 1.0rem;
  }
  #footer .icon-logo {
	font-size: 5.2rem;
  }
}
  /* 600px以降から、100pxごとに大きくなる */
@media only screen and (min-width: 600px) {
/* 10段 */
  .fSiteName {
    font-size: calc(1.0em + 10 * (100vw - 600px) / 600);
  }
  .fSubuName {
	font-size: calc(0.625em + 6 * (100vw - 600px) / 600);
  }
  #footer .icon-logo {
	font-size: calc(3.250em + 20 * (100vw - 600px) / 600);
  }
}
/* 1,200px以上は固定  */
@media only screen and (min-width: 1200px) {
  .fSubuName {
	font-size: 1.6rem;
  }
}  
/* 1,600px以上は固定  */
@media only screen and (min-width: 1600px) {
  .fSiteName {
    font-size: 3.6rem;
  }
  #footer .icon-logo {
	font-size: 8.2rem;
	line-height: 45px;
  }	
}
#footer ul {
    margin-bottom: 10px;
		padding-left: 10px;
}
#footer ul li {
    display: inline-block;
    margin-right: 15px;
}
#footer ul li a{
		font-size: 1.4rem;
}
#footer ul li a i {
		margin-top: 0px;
}
.copyright {
	text-align: right;
	background: #e0e0e0;
    padding: 5px 5px 5px 0;
}
@media screen and (max-width: 992px){
#footer ul {
    border-bottom: 1px solid #e2e2e2;
    margin-bottom: 0px;
		padding-left: 0px;
}
#footer ul li {
    display: block;
    margin-right: 0px;
}
#footer ul li a{
    display: block;
    background: #fafafa;
    border-top: 1px solid #e2e2e2;
    height: 50px;
    line-height: 50px;
		padding-left: 10px;
}
#footer .fSiteName {
    letter-spacing: 0.7rem;
}
.copyright {
	text-align: center;
}
}

/*----------------------------------------
   basic
------------------------------------------*/
.basicSpace {
	padding: 75px 0 30px;
}
.basicSpace02 {
	padding: 35px 0 30px;
}
.basicSpace03 {
	padding: 0 0 30px;
}
.leftRightSpace {
	padding-right: calc(2.5% + 0.75rem)!important;
	padding-left: calc(2.5% + 0.75rem)!important;
	
}
.m-i-sp {
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 5px;
}
.scrollHide {
    opacity: 0;
}
.opa1 {
    opacity: 1;
}
#wrapper {
  left: 0;
  width: 100%;
  overflow: hidden;
}
#wrapper ul {
  height: 100%;
 padding: 0 0 0 25px;
 
}
#wrapper li {
  float: left;
  width: 440px;
  text-align: center;
  background: transparent;
  cursor: w-resize;
}
#wrapper li .card {
  text-align: center;
  width: calc(100% - 40px);
  background: #fafafa;
  padding: 45px 35px;
      margin: 0 auto;
}
#wrapper li .card-box {
	overflow: hidden;
}
@media screen and (max-width: 992px){
.basicSpace {
	padding: 45px 0 15px;
}
#wrapper li {
  width: 330px;
}
#wrapper li .card {
  padding: 20px 15px;
}
}
@media screen and (max-width: 600px){
#wrapper li {
  width: 250px;
}
#wrapper li .card {
  padding: 15px;
}
}

/* commonBox */
.commonBox,
.commonBox02 {
    width: 98%;
    margin: 0 auto;
}
.commonBoxP {
	padding: 0 0.75rem;
}
.commonBox .card {
	padding: 20px;
	background: #fafafa;
}


/* secondTitleBox */
.secondTitleBox {
	width: 94%;
    margin: 0 auto;
    overflow: hidden;
    padding-top: 15px;
}
.secondTitleBox .right-align {
    margin: 2px 0 0 0;
}
.secondTitle {
    overflow: hidden;
    border-bottom: 1px solid #303030;
    margin-bottom: 15px;
    padding-bottom: 10px;
}
.secondTitle h1 {
    font-weight: inherit;
    letter-spacing: 0.5rem;
    position: relative;
    line-height: normal;
	padding-left: 7rem;
	margin-top: 9px;
}
.secondTitle .shikaku-shikaku {
		float: left;
		margin-right: 8px;
}
@media only screen and (min-width: 0) {
  .secondTitle h1 {
    font-size: 1.6rem;
  }
  .secondTitle .shikaku-shikaku {
		font-size: 3.2rem;
  }
  .secondTitle p {
		font-size: 1.0rem;
    color: #b9b9b9;
    padding-left: 7rem;
    text-decoration: blink;
    font-style: italic;
  }
}
  /* 600px以降から、100pxごとに大きくなる */
@media only screen and (min-width: 600px) {

/* 10段 */
  .secondTitle h1{
    font-size: calc(1.0em + 10 * (100vw - 600px) / 600);
  }
  .secondTitle .shikaku-shikaku {
		font-size: calc(2.0em + 20 * (100vw - 600px) / 600);
  }
  .secondTitle p {
    font-size: calc(0.625em + 4 * (100vw - 600px) / 600);
  }
}
/* 1,200px以上は固定  */
@media only screen and (min-width: 1200px) {
  .secondTitle p {
	font-size: 1.4rem;
  }
}  
/* 1,600px以上は固定  */
@media only screen and (min-width: 1600px) {
  .secondTitle h1{
    font-size: 3.6rem;
  }
  .secondTitle .shikaku-shikaku {
		font-size: 7.2rem;
  }
}

@media screen and (max-width: 1200px){
	.secondTitle h1 {
		margin-top: 6px;
    padding-left: 6rem;
	}
  .secondTitle p {
    padding-left: 6rem;
	}
}
@media screen and (max-width: 992px){
	.secondTitle h1 {
    margin: 5px 0 0 0;
    padding-left: 5rem;
	}
  .secondTitle p {
    padding-left: 5rem;
	}
}
@media screen and (max-width: 750px){
	.secondTitle h1, .secondTitle p {
    padding-left: 4.55rem;
	}
}
@media screen and (max-width: 600px){
	.secondTitle h1, .secondTitle p {
    padding-left: 4rem;
	}
}
.secondTitleBox nav {
    background: none;
    box-shadow: none;
    height: inherit;
    line-height: inherit;
    width: initial;
}
.secondTitleBox .breadcrumbs {
    list-style: none;
    padding: 0 0.5rem;
    margin: 0px auto;
}
.secondTitleBox li {
    display: inline;
    color: #999;
    float: none;
}
.secondTitleBox nav ul li.active {
    background: none;
}
.secondTitleBox .breadcrumbs>li+li:before {
    color: #ccc;
    padding-right: 15px;
    content: "/";

}
.secondTitleBox li a {
    color: #b93436;
    display: inline;
    padding: 3px 15px;
}

@media only screen and (min-width: 1280px) {
.secondTitleBox .breadcrumbs {
        padding: 0 500px 0 0.5rem;
}
}
@media screen and (max-width: 992px) {
.secondTitleBox .right-align {
    display: none;
}
.secondTitleBox li {
	line-height: 20px;
}
.secondTitleBox li a {
	padding: 3px 5px;
}
.secondTitleBox .breadcrumbs>li+li:before {
	padding-right: 5px;
}
}
/* compositeBox */
.compositeBox {
	position: relative;
	min-height: 41px;
}
.compositeBox .snsBox {
	top: 0;
    height: 41px;
    line-height: 41px;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}
.compositeBox .snsBox li {
    position: static;
    z-index: 1;

}
.compositeBox .snsBox li:nth-child(n + 2) {
    background: #303030;
}
.compositeBox .snsBox li.shareText {
    transition: .3s ease-out;
    height: 41px;
    line-height: 41px;
    display: inline-block;
    padding: 0 15px;
    color: #fafafa;
    font-size: 1.6rem;
    letter-spacing: 0.5rem;
	position: relative;
    top: 0;
    left: 0px;
    width: 136px;
    z-index: 0;
}
.compositeBox .snsBox li i{
	color: #fafafa;
    line-height: 41px;
    height: 41px;
    display: inline-block;
}
.compositeBox .snsBox a:hover i {
    color: #d19826;
}
@media screen and (max-width: 1280px) {
.compositeBox .snsBox {
    display: none;
}
}
/* bannerBox */
.bannerBox {
    padding: 50px 0 50px 80px;
}
.bannerBox .commonBox {
    border-top: 1px dashed #c5c5c5;
    padding-top: 35px;
}
.bannerBox li {
	margin: 0 0 1.5rem 0;
}
.bannerBox img {
    display: block;
    width: 100%;
}
@media screen and (max-width: 992px) {
	.bannerBox {
		padding-left: 0px;
}
	.compositeBox {
		min-height: initial;
	}
}

/* Refund */
#refund {
    position: relative;
}
#refund .shikaku-shikaku_top {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 16rem;
    color: #fafafa;
}
#refund .shikaku-shikaku_top.t02 {
    top: 48px
}
#refund .shikaku-shikaku_bottom {
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 16rem;
    color: #fafafa;
}
#refund h2{
    background: #dcdcdc;
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    padding: 5px 14px;
    float: left;
}
#refund h3 {
    font-size: 1.2rem;
    font-weight: bold;
    padding: 5px 14px 2px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.refundBT {
    color: #fafafa;
    text-align: center;
    letter-spacing: 0.25rem;
    font-weight: bold;
    margin-bottom: 10px;
    z-index: 1;
    position: relative;
}
@media screen and (max-width: 1280px) {
#refund .commonBox .card {
    padding: 15px;
}
}
@media screen and (max-width: 750px) {
#refund .shikaku-shikaku_top {
    font-size: 10rem;
}
#refund .shikaku-shikaku_bottom {
    font-size: 10rem;
}
}
@media screen and (max-width: 600px) {
#refund .commonBox .col {
	padding: 0;
}
#refund .commonBox .card {
    padding: 10px;
    background: #fafafa;
    box-shadow: none;
    border-radius: 0;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin: 0;
}
#refund h2{
    padding: 3px 6px 1px;
}
#refund .shikaku-shikaku_top {
    font-size: 8rem;
}
#refund .shikaku-shikaku_bottom {
    font-size: 8rem;
}
}
/* Pagination */
.pagination {
    visibility: initial;
    display: block;
    text-align: center;
}
.pagination span,.pagination a {
    display: inline-block;
    line-height: 30px;
    border-radius: 2px;
    text-align: center;
    font-weight: bold;
    padding: 0 10px;
    margin-right: 4px;
    margin-bottom: 10px;
}
.pagination a {
    color: #fff;
    border: 1px solid #fafafa;
}
.pagination .current {
    background-color: #f9faf9;
    border: 1px solid #fafafa;
}

/*---------------------------------
    loader
-----------------------------------*/

#fade {
    background-color: #262626;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1000;
    width: 100%;
    height: 100%;
}
#fade::before{
	background:url('/test/images/top_loder_bg.jpg') 50%/cover no-repeat; 
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:1001;
	width:100%;
	height:100%;
	-webkit-background-size:cover;/*Android4*/
}
#fade::after{
	content: "";
    display: block;
    position: fixed;
    top: 3%;
    left: 3%;
    z-index: 1001;
    width: 94%;
    height: 94%;
    background: rgba(0, 0, 0, 0.3);
}
#loader {
    width: 167px;
    height: 285px;
    display: none;
    position: fixed;

    top: 50%;
    left: 50%;
    margin-top: -142.5px;
    margin-left: -88.5px;
    z-index: 1001;
}
.progress {
    background-color: #f1f1f1;
}
.progress .indeterminate {
    background-color: #00896c;
}
/* fade TOP TEXT SVG START */
@font-face {
  font-family: 'icomoon_text';
  src:  url('/test/fonts/iconmoon_text/icomoon.eot?okrs0j');
  src:  url('/test/fonts/iconmoon_text/icomoon.eot?okrs0j#iefix') format('embedded-opentype'),
    url('/test/fonts/iconmoon_text/icomoon.ttf?okrs0j') format('truetype'),
    url('/test/fonts/iconmoon_text/icomoon.woff?okrs0j') format('woff'),
    url('/test/fonts/iconmoon_text/icomoon.svg?okrs0j#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="top_text"], [class*="top_text"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon_text' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.top_text {
    font-size: 28.5rem;
}
.top_text .path1:before {
  content: "\e900";
  color: #f1f1f1;
}
.top_text .path2:before {
  content: "\e901";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path3:before {
  content: "\e902";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path4:before {
  content: "\e903";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path5:before {
  content: "\e904";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path6:before {
  content: "\e905";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path7:before {
  content: "\e906";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path8:before {
  content: "\e907";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path9:before {
  content: "\e908";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path10:before {
  content: "\e909";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path11:before {
  content: "\e90a";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path12:before {
  content: "\e90b";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path13:before {
  content: "\e90c";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path14:before {
  content: "\e90d";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path15:before {
  content: "\e90e";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path16:before {
  content: "\e90f";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path17:before {
  content: "\e910";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path18:before {
  content: "\e911";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path19:before {
  content: "\e912";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path20:before {
  content: "\e913";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path21:before {
  content: "\e914";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path22:before {
  content: "\e915";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path23:before {
  content: "\e916";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path24:before {
  content: "\e917";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path25:before {
  content: "\e918";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path26:before {
  content: "\e919";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path27:before {
  content: "\e91a";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path28:before {
  content: "\e91b";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.top_text .path29:before {
  content: "\e91c";
  margin-left: -0.5703125em;
  color: #f1f1f1;
}
.secondLoader #fade {
    z-index: 3;
}
.secondLoader #fade,
.secondLoader #fade::before {
	width: calc(100% - 80px);
	left: 80px;
	background: #272727;
}
.secondLoader #fade::after {
	display: none;
}
.secondLoader #loader {
		width: 147px;
    height: 165px;
    margin-left: -73.5px;
    margin-top: -82.5px;
}
.secondLoader .icon-logo {
    font-size: 14.7rem;
}
.secondLoader .icon-logo .path1:before {
    color: rgb(39, 39, 39);
}
@media screen and (max-width: 992px) {
.secondLoader #fade,
.secondLoader #fade::before {
	width: 100%;
	left: 0px;
	top: 72px;
}
.secondLoader #loader {
    width: 120px;
    height: 135px;
    margin-left: -60px;
    margin-top: -67.5px;
}
.secondLoader .icon-logo {
    font-size: 12rem;
}
}
@media screen and (max-height: 400px) {
#loader {
	height: 205px;
	margin-top: -102.5px;
	margin-left: -58.5px;
}
.top_text {
    font-size: 20.5rem;
}
}
/*---------------------------------
    タッチ＆クリックイベント
-----------------------------------*/
.t-m-event {
	overflow: hidden;
}
.t-m-event img {
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.eventOn img {
	transform: scale(1.1,1.1);
    -webkit-transform: scale(1.1,1.1);
    -moz-transform: scale(1.1,1.1);
    -ms-transform: scale(1.1,1.1);
    -o-transform: scale(1.1,1.1);
    opacity: 0.65;
}
.side-nav .collapsible-header:hover, .side-nav.fixed .collapsible-header:hover, .side-nav a:hover {
	background-color: transparent;
}
.side-nav .eventOn {
    -webkit-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background-color: rgba(0,0,0,0.25)!important;
}
.arrow a.eventOn {
    text-decoration: underline;
}
/*---------------------------------
    SNSアイコン
-----------------------------------*/
@font-face {
  font-family: 'icomoon_sns';
  src:  url('/test/fonts/icomoon_sns/icomoon.eot?a2hnjo');
  src:  url('/test/fonts/icomoon_sns/icomoon.eot?a2hnjo#iefix') format('embedded-opentype'),
    url('/test/fonts/icomoon_sns/icomoon.ttf?a2hnjo') format('truetype'),
    url('/test/fonts/icomoon_sns/icomoon.woff?a2hnjo') format('woff'),
    url('/test/fonts/icomoon_sns/icomoon.svg?a2hnjo#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="sns-icon-"], [class*=" sns-icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon_sns' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sns-icon-hatebu:before {
  content: "\e900";
}
.sns-icon-pocket:before {
  content: "\e901";
}
.sns-icon-line:before {
  content: "\e902";
}
.sns-icon-google-plus:before {
  content: "\ea8c";
}
.sns-icon-facebook:before {
  content: "\ea90";
}
.sns-icon-twitter:before {
  content: "\ea96";
}
/*---------------------------------
    shikakuアイコン
-----------------------------------*/
@font-face {
  font-family: 'icomoon_shikaku';
  src:  url('/test/fonts/icomoon_shikaku/icomoon.eot?ipftzc');
  src:  url('/test/fonts/icomoon_shikaku/icomoon.eot?ipftzc#iefix') format('embedded-opentype'),
    url('/test/fonts/icomoon_shikaku/icomoon.ttf?ipftzc') format('truetype'),
    url('/test/fonts/icomoon_shikaku/icomoon.woff?ipftzc') format('woff'),
    url('/test/fonts/icomoon_shikaku/icomoon.svg?ipftzc#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="shikaku-"], [class*=" shikaku-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon_shikaku' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.shikaku-shikaku_bottom:before {
  content: "\e900";
}
.shikaku-shikaku_top:before {
  content: "\e901";
}
.shikaku-shosai:before {
  content: "\e902";
}
.shikaku-shikaku .path1:before {
  content: "\e903";
  color: rgb(185, 52, 54);
}
.shikaku-shikaku .path2:before {
  content: "\e904";
  margin-left: -1em;
  color: rgb(0, 137, 108);
}
.shikaku-shikaku .path3:before {
  content: "\e905";
  margin-left: -1em;
  color: rgb(209, 152, 38);
}
.shikaku-shikaku .path4:before {
  content: "\e906";
  margin-left: -1em;
  color: rgb(48, 48, 48);
}

/*=================================================================================
    Header&nav
====================================================================================*/
.navbar-fixed {
    position: fixed;
    height: 100%;
    z-index: 3;
}

.navbar-fixed nav {
    line-height: initial;
    width: 80px;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition-property: left,-webkit-transform,margin-left;
    -moz-transition-property: left,-moz-transform,margin-left;
    transition-property: left,transform,margin-left;
    transition-duration: .6s;
    transition-timing-function: cubic-bezier(.645,.045,.355,1);
    left: 0;
    top: 0;
    position: absolute;
}
.navbar-fixed nav ul {
    border-top: 1px solid #262626;
    position: relative;
    padding-top: 1px;
}
.navbar-fixed nav ul::before {
    position: absolute;
    top: 0px;
    left: 0;
    content: '';
    height: 1px;
    z-index: 2;
    width: 100%;
    background-color: #3c3c3c;
}
.navbar-fixed nav ul li {
    float: none;
    padding-left: 4px;
    width: 80px;
    position: relative;
    border-bottom: 1px solid #262626;
}
.navbar-fixed nav ul li.search {
    padding-left: 0px;
}
.navbar-fixed nav ul li::before {
    position: absolute;
    bottom: -2px;
    left: 0;
    content: '';
    height: 1px;
    z-index: 2;
    width: 100%;
    background-color: #3c3c3c;
}

.navbar-fixed nav ul a {
    padding: 0;
    color: #f1f1f1;
    text-align: center;
    height: 65px;
    font-size: 1.3rem;
    letter-spacing: 0.2rem;
    line-height: 68px;
}
.navbar-fixed nav ul li.search a {
    height: 55px;
    line-height: 58px;
}
.navbar-fixed nav ul a.lessLetters {
    letter-spacing: 0.6rem;
}
.navbar-fixed nav ul a.twoLines {
    line-height: 1.8rem;
    padding: 17px 4px;
}
.navbar-fixed nav ul a:hover,
.button-collapse:hover{
    background-color: rgba(0, 0, 0, 0.15);
}
.navbar-fixed nav ul li i.material-icons {
    height: 25px;
    line-height: 21px;
    display: inline-block;
    font-size: 2.3rem;
    margin-right: 0.4rem;
    vertical-align: middle;
}
.button-collapse {
    position: fixed;
    z-index: 4;
    color: #f1f1f1;
    font-size: 1rem;
    letter-spacing: 0.2rem;
    width: 80px;
    text-align: center;
    height: 72px;
    display: block;
    padding: 10px 0;
    transition: background-color .3s;
    border-bottom: 1px solid #303030;
}
.button-collapse::before {
    position: absolute;
    bottom: -2px;
    left: 0;
    content: '';
    height: 1px;
    z-index: 2;
    width: 100%;
    background-color: #3c3c3c;
}
.button-collapse i {
    height: 36px;
    text-align: center;
    line-height: 40px;
    display: block;
    font-size: 4rem;
}
.logo .icon-logo {
    font-size: 8.5rem;
    position: absolute;
    bottom: 15px;
    left: -5px;
}
/* header LOGO SVG START */
@font-face {
  font-family: 'icomoon';
  src:  url('/test/fonts/iconmoon/icomoon.eot?4p9ujz');
  src:  url('/test/fonts/iconmoon/icomoon.eot?4p9ujz#iefix') format('embedded-opentype'),
    url('/test/fonts/iconmoon/icomoon.ttf?4p9ujz') format('truetype'),
    url('/test/fonts/iconmoon/icomoon.woff?4p9ujz') format('woff'),
    url('/test/fonts/iconmoon/icomoon.svg?4p9ujz#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-logo .path1:before {
  content: "\e900";
  color: rgb(48, 48, 48);
}
.icon-logo .path2:before {
  content: "\e901";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path3:before {
  content: "\e902";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path4:before {
  content: "\e903";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path5:before {
  content: "\e904";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path6:before {
  content: "\e905";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path7:before {
  content: "\e906";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path8:before {
  content: "\e907";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path9:before {
  content: "\e908";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path10:before {
  content: "\e909";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path11:before {
  content: "\e90a";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path12:before {
  content: "\e90b";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path13:before {
  content: "\e90c";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path14:before {
  content: "\e90d";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path15:before {
  content: "\e90e";
  margin-left: -1em;
  color: rgb(241, 241, 241);
}
.icon-logo .path16:before {
  content: "\e90f";
  margin-left: -1em;
  color: rgb(48, 48, 48);
}
/* header LOGO SVG END */

/*=================================================================================
    Sidebar
====================================================================================*/
/*----------------------------------------
    Sidebar Main Menu 
------------------------------------------*/
#slide-out {
    overflow:hidden;
    z-index: 1003;
}
.dummy {
    height: 120px;
    background: none!important;
}
.side-nav .icon-logo {
    font-size: 8.4rem;
    padding: 9px 0 7px;
    display: block;
}
.side-nav .bg_color01 li {
    line-height: 24px;
}
@media screen and (max-width: 992px){
    .navbar-fixed {
        height: 72px;
        width: 100%;
    }
    .navbar-fixed nav {
        width: 100%;
        height: 72px;
        display: inline-block;
        border: none;
    }
    .navbar-fixed nav ul {
        text-align: center;
        padding: 0;
        border: none;
    }
    .navbar-fixed nav ul::before,.navbar-fixed nav ul li::before,.button-collapse::before {
        height: 0;
    }
    .navbar-fixed nav ul li {
        display: inline-block;
        padding: 4px 0 0px 0px;
        border: none;
        height: 72px;
    	vertical-align: top;
    }
    .navbar-fixed nav ul a {
        height: 68px;
	    line-height: 68px;
	    font-size: 1.2rem;
	}
	.button-collapse {
	    right: 0;
   		top: 0;
    	height: 72px;
    }
    .logo .icon-logo {
    	left: 0px;
    	bottom: 4px;
    	font-size: 6.2rem;
    }
    .navbar-fixed nav ul li.search {
        display: none;
    }
}
@media screen and (max-width: 750px){
    .navbar-fixed nav ul li:last-child, .navbar-fixed nav ul li:nth-last-child(2), .navbar-fixed nav ul li:nth-last-child(3){
        display: none;
    }
}
@media screen and (max-width: 500px){
    .navbar-fixed nav ul li:nth-last-child(4){
        display: none;
    }
    .navbar-fixed nav ul a.lessLetters {
    	letter-spacing: 0.3rem;
	}
    .navbar-fixed nav ul li {
    	width: 65px;
    }
    .button-collapse i {
    	font-size: 3.5rem;
    }
}
@media screen and (max-width: 350px) {
	.navbar-fixed nav ul li, .button-collapse {
    	width: 60px;
	}
}
@media screen and (min-width: 992px) and (max-height: 650px) {
    .navbar-fixed nav ul {
        display: none;
    }
}



.navbar-fixed nav ul li.no-hover:hover{
  background: none;
}

.profileBox:hover {
    background: rgba(255, 255, 255, 0.15);
}
ul.side-nav.leftside-navigation hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #e0e0e0;
  margin: 1em 0;
  padding: 0;
}
.side-nav a,  {
  line-height: 42px;
  height: 42px;
}
.side-nav .subheader {
  padding: 0 32px;
  font-size: 1.15rem;
  letter-spacing: 0.3rem;
}
#left-sidebar-nav {
	position: fixed;
	width: 100px;
	left: 180px;
	z-index: 999;
	height: auto;
}
#slide-out li a i {
	width: 2rem;
	font-size: 2.6rem;
	display: block;
	float: left;
	text-align: center;
	margin-right: 1rem;
	position: absolute;
	top: -2px;
	right: 2%;
	height: 48px;
	line-height: 48px;
}
#slide-out ul.side-nav li {
  padding: 0px !important;
}
ul.side-nav li {
  padding: 0;
}
ul.side-nav span.badge{
	line-height: 20px;
    margin-top: 12px;
    float: none;
    color: #ffffff;
    border-radius: 2px;
    min-width: 3rem;
    padding: 0 6px;
    text-align: center;
    font-size: 1rem;
    position: absolute;
    right: 15px;
    box-sizing: border-box;
}
ul.side-nav .collapsible-header {
 	margin: 0;
	position: relative;
	padding: 0 32px;
}
ul.side-nav .active > .collapsible-header,
#slide-out li.active a i {
    color: #00896c;
}
@media only screen and (max-width: 992px) {
ul.side-nav .collapsible-header,
.side-nav .subheader {
	padding: 0 16px;
}
}
.caption {
  font-size: 1.25rem;
  font-weight: 300;
  margin-bottom: 30px;
}
.caption-uppercase {
  font-size: 1.25rem;
  font-weight: 300;
  margin-bottom: 30px;
  text-transform: uppercase;
}
.sidebar-collapse {
  position: absolute;
  left: -170px;
  top: -45px;
}

ul.side-nav.leftside-navigation {
  overflow: hidden;
}
ul.side-nav.leftside-navigation li {
  line-height: 44px;
}
/*
ul.side-nav.leftside-navigation li:hover,
ul.side-nav.leftside-navigation li.active {
  background-color: rgba(0, 0, 0, 0.08);
}
*/	
ul.side-nav.leftside-navigation li a {
  font-size: 1.4rem;
  font-weight: 500;
}
.side-logo a {
    height: inherit!important;
    line-height: inheri!important;
    padding: 0!important;
}
ul.side-nav.leftside-navigation .collapsible-accordion .paragraph {
	padding: 0 23.5px 0 47px;
}
.side-nav.leftside-navigation .collapsible-body li.active,
.side-nav.fixed.leftside-navigation .collapsible-body li.active{
  background-color: #d8f1ec;
}
.side-nav.leftside-navigation .collapsible-body li.active a,
.side-nav.fixed.leftside-navigation .collapsible-body li.active a{
    color: #444;
}
.side-nav .collapsible-body li a{
    padding: 0 23.5px 0 32px;;
}
ul.side-nav.leftside-navigation ul.collapsible-accordion {
  background-color: #FFF;
}
ul.side-nav.leftside-navigation:hover {
  /*overflow-y:hidden;*/
}
ul.side-nav.leftside-navigation li.user-details {
  background: url(../images/user-bg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  /*overflow: hidden;*/
  
  margin-bottom: 15px;
  padding: 15px 0px 0px 15px;
}
.user-details .row {
  margin: 0;
}
.user-task,
.user-time {
  margin: 0;
  font-size: 13px;
  color: #fff;
}
ul.side-nav.leftside-navigation .profile-image {
  /*height: 50px;*/
}
ul.side-nav.leftside-navigation .profile-btn {
  margin: 0;
  text-transform: capitalize;
  padding: 0;
  text-shadow: 1px 1px 1px #444;
  font-size: 15px;
}
.user-roal {
  color: #fff;
  margin-top: -16px;
  font-size: 13px;
  text-shadow: 1px 1px 1px #444;
}
.bold > a {
  font-weight: bold;
}
nav.top-nav {
  height: 122px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
nav.top-nav a.page-title {
  line-height: 122px;
  font-size: 48px;
}

/* =================================================================================
    Content
================================================================================= */
/*----------------------------------------
    Breadcrumb
------------------------------------------*/

.breadcrumb {
  padding: 0px;
  margin: 15px 0px;
  list-style: none;
}
.breadcrumbs-title {
  font-size: 1.5rem;
  line-height: 1.804rem;
  margin: 18px 0px 0px 0px;
}
.breadcrumb > li {
  display: inline-block;
}
.breadcrumb a {
  color: #00bcd4;
}
.breadcrumb .active {
  font-weight: normal;
  color: #999;
}
.breadcrumb > li + li:before {
  padding: 0 5px;
  color: #ccc;
  content: "/\00a0";
}
h5.breadcrumbs-header {
  font-size: 1.64rem;
  line-height: 1.804rem;
  margin: 1.5rem 0 0 0;
}
.breadcrumbs-nav {
  margin: 8px 0 9px 0;
}
/*----------------------------------------
    Cards
------------------------------------------*/
/*card-stats*/

#card-stats .card-content {
  text-align: center;
}
#card-stats .card-stats-title, #card-stats .card-stats-title i {
  font-size: 1.2rem;
}

#card-stats .card-stats-compare {
  font-size: 1.0rem;
}
#card-stats .card-stats-compare i{
  position: relative;
  top: 5px
}
#card-stats .card-stats-number {
  font-size: 1.8rem;
  line-height: 2.0rem;
  margin: 0.2rem 0 0.2rem 0;
  font-weight: 500;
}
/*work-collections*/

#work-collections .collection-header {
  font-size: 1.64rem;
  font-weight: 500;
}
#work-collections .collection-item.avatar {
  height: auto;
}
#work-collections p.collections-title {
  font-size: 1.0rem;
  padding: 0;
  margin: 0;
  font-weight: 500;
}
#work-collections p.collections-content {
  font-size: 0.9rem;
  padding: 0;
  margin: 0;
  font-weight: 400;
}
/*flight-card*/

#flight-card .card-header .card-title {
  padding: 20px;
}
#flight-card .flight-card-title {
  margin: 0;
  font-weight: 300;
}
#flight-card .flight-card-date {
  font-size: 1.0rem;
  margin: 0;
}
#flight-card .flight-state {
  padding-bottom: 15px;
}
#flight-card .flight-state-two {
  border-left: 1px dashed #9e9e9e;
}
#flight-card .flight-icon {
  font-size: 2.2rem;
  display: block;
  -webkit-transform: rotate(90deg);
  /* Safari */
  
  -moz-transform: rotate(90deg);
  /* Firefox */
  
  -ms-transform: rotate(90deg);
  /* IE */
  
  -o-transform: rotate(90deg);
  /* Opera */
  
  filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3); 
  /* SASS Internet Explorer */
}
#flight-card .card-content-bg {
  background: url(../images/sample-1.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#flight-card .card-content {
  background: rgba(0, 0, 0, 0.25);
}
#flight-card .flight-state-wrapper {
  margin: 0 0 100px 0 !important;
}
/*task-card*/

#task-card label {
  display: block;
  color: rgba(0, 0, 0, 0.87);
  height: auto;
}
#task-card .task-card-title {
  margin: 0;
  color: #fff;
  font-weight: 300;
}
#task-card .task-card-date {
  font-size: 1.0rem;
  margin: 0;
  color: #fff;
}
#task-card .collection-header {
  padding: 20px;
}
#task-card .task-add{
  position: absolute;
  right: 10px;
  top: 76px;
}
#task-card .task-cat {
  padding: 2px 4px;
  color: #fff;
  margin-left: 37px;
  font-weight: 300;
  font-size: 0.8rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-clip: padding-box;
}
.task-cat {
  padding: 2px 4px;
  color: #fff;
  font-weight: 300;
  font-size: 0.8rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-clip: padding-box;
}
.collection .collection-item.avatar i.circle {
  font-size: 28px;
}
/* Profile Card */

#profile-card .card-image {
  height: 150px;
}
#profile-card .card-content p {
  font-size: 1.2rem;
  margin: 10px 0 12px 0;
}
#profile-card .card-profile-image {
  width: 70px;
  position: absolute;
  top: 110px;
  z-index: 1;
  cursor: pointer;
}
#profile-card .btn-move-up {
  position: relative;
  top: -40px;
  right: -18px;
  margin-right: 10px !important;
}
/*----------------------------------------
   modal
------------------------------------------*/
.modal {
	position: absolute!important;
    width: 95%;
}
.modal .modal-content {
    margin-top: 35px;
}
.modal .title {
    font-size: 1.5rem;
    text-align: center;
    width: 100%;
    background: #DFDFDF;
    padding: 8px;
    border-radius: 2px;
    margin-bottom: 30px;
}
.modal .title i {
    font-size: 1.8rem;
    height: 21px;
    line-height: 15px;
    vertical-align: middle;
    margin-left: 5px;
    margin-bottom: -5px;
}
.modal-cancel {
    padding: 7px 7px;
    position: absolute;
    right: 0px;
    top: 0;
}
#modal .modal-cancel i,
#modal2 .modal-cancel i,
#modal3 .modal-cancel i {
    border-radius: 50%;
    margin: 0px 5px 0 0;
    font-size: 3.5rem;
    vertical-align: middle;
    color: #00896c;
    padding: 7px;
    line-height: 34px;
}
.modal.bottom-sheet {
    height: 100%;
    max-height: 100%;
}
.modal-bg-stop {
	overflow: hidden;
    height: 100%;
}
/*----------------------------------------
    Shadow effect
------------------------------------------*/
.shadow-demo {
  background-color: #26a69a;
  width: 100px;
  height: 100px;
  margin: 20px auto;
}
.collapsible-header {
  font-weight: 500;
}
/*----------------------------------------
    slider
------------------------------------------*/
.slider {
    margin-bottom: -40px;
}
.slider h1 {
    font-size: 2.92rem;
    line-height: 110%;
    margin: 1.46rem 0 1.168rem 0;
    text-shadow: 2px 1.5px 1px #444
}
.slider h2 {
    font-size: 1.64rem;
    line-height: 110%;
    margin: 0.82rem 0 0.656rem 0;
    text-shadow: 2px 1.5px 1px #444;
}
.slider .sliderTopText {
    position: absolute;
    top: 5px;
    right: 4px;
    z-index: 2;
    color: #f1f1f1;
    font-size: 1.2rem;
    text-shadow: 1px 1px 1px #444;
}
.slider .indicators {
    bottom: 50px;
    z-index: 2;
    left: calc(50% - 160px);
    width: 310px;
}
.slider .indicators .indicator-item {
    background-color: #f1f1f1;
}
.slider .indicators .indicator-item.active {
    background-color: #00896c;
}
.slider .slides li a {
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
}
@media screen and (max-width: 720px) {
.slider .sliderTopText {
    display: none;
}
}
/*----------------------------------------
    postNumber&snsBox
------------------------------------------*/
.postNumber {
    padding: 1rem 1rem 0.7rem;
    display: inline-block;
    width: 100%;
    z-index: 2;
}
.postNumber li {
    display: inline-block;
    margin-right: 15px;
}
.postNumber li + li {
    margin-right: 0px;
}
.snsBox {
    position: absolute;
    top: 8px;
    right: 15px;
    font-size: 2.4rem;
}
.postNumber .snsBox li {
    margin: 0;
    padding: 0px 12px;
}
.snsBox i {
		color: #666666;
}
.snsBox a:hover i {
		color: #00896c;
}
@media screen and (max-width: 720px) {
.snsBox {
		display: none;
}
}
/*----------------------------------------
    masonry
------------------------------------------*/
.item {
    width: 12.5%;
    padding: 0.5px;
    float: left;
    height: auto;
}
.wBig {
    width: 25%;
}
.item h1 {
    background-color: rgba(0,0,0,0.5);
    position: absolute;
    width: calc(100% - 1px);
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    margin-left: 0%;
    padding: 7px 10px 3px 10px;
    color: #f1f1f1;
    line-height: 2.5rem;
}
.item .textBottom {
	bottom: 12%;
}
.item .textMiddle {
    bottom: calc(50% - 40px);
}
.item .textTop {
    top: 12%;
}

    
@media screen and (max-width: 1600px) {
.item {
    width: 16.666%;
}
.wBig {
    width: 33.333%;
}
}
@media screen and (max-width: 1440px) {
.item {
    width: 16.666%;
}
.wBig {
    width: 33.333%;
}
}
@media screen and (max-width: 1280px) {
.item {
    width: 25%;
    padding: 1.5px;
}
.wBig {
    width: 50%;
}
.item h1 {
    width: calc(100% - 3px);
}
}
@media screen and (max-width: 600px) {
.item {
    width: 50%;
    padding: 3px;
}

.wBig {
    width: 100%;
}
.item h1 {
    width: calc(100% - 6px);
}
}
#masonry img {
    width: 100%;
    height: inherit;
    display: block;
}
/*----------------------------------------
    spSns
------------------------------------------*/
#spSns a {
    width: 56px;
    height: 56px;
}
#spSns i {
	font-size: 2.4rem;
    line-height: 56px;
}
#spSns li a {
    width: 100%;
    height: 100%;
}
#spSns li i {
    line-height: 60px;
}
.fixed-action-btn {
    z-index: 2;
}
.fixed-action-btn.toolbar {
    height: 60px;
}
.fixed-action-btn.toolbar ul li a {
    line-height: 60px;
}
/*----------------------------------------
    topContents
------------------------------------------*/
.titleText {
    position: absolute;
    top: calc(50% - 42.5px);
    text-align: center;
    width: 100%;
    left: 0;
}
.titleBox .shikaku-shikaku {
	display: inline-block;
	height: 85px;
    line-height: 85px;
}
.titleBox .titleTextBox{
	display: inline-block;
    height: 85px;
    line-height: 85px;
}
.titleBox h1 {
    font-weight: inherit;
    letter-spacing: 1rem;
    position: relative;
    margin: 10px 0 0 10px;
    line-height: normal;
}

.titleBox h1::after{
	position: absolute;
    bottom: 0;
    z-index: 1;
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: rgba(0, 0, 0, 0.87);
}
.titleBox p {
    font-style: italic;
    text-align: center;
    line-height: 1.5;
    margin-top: 8px;
    letter-spacing: 0.5rem;
    color: #a9a9a9;
}


@media only screen and (min-width: 0) {
  .titleBox {
    height: 300px;
  }
  .titleBox h1 {
    font-size: 1.6rem;
	margin: 10px 0 0 2px;
  }
  .titleBox .shikaku-shikaku {
	font-size: 5.2rem;
  }
  .titleBox p {
	font-size: 1.0rem;
  }
}
  /* 600px以降から、100pxごとに大きくなる */
@media only screen and (min-width: 600px) {
.titleBox {
	height: 450px;
}
/* 10段 */
  .titleBox h1{
    font-size: calc(1.0em + 10 * (100vw - 600px) / 600);
  }
  .titleBox .shikaku-shikaku {
	font-size: calc(3.250em + 20 * (100vw - 600px) / 600);
  }
  .titleBox p {
	font-size: calc(0.625em + 6 * (100vw - 600px) / 600);
  }
}
/* 1,200px以上は固定  */
@media only screen and (min-width: 1200px) {
  .titleBox p {
	font-size: 1.6rem;
  }
}  
/* 1,600px以上は固定  */
@media only screen and (min-width: 1600px) {
  .titleBox h1{
    font-size: 3.6rem;
  }
  .titleBox .shikaku-shikaku {
	font-size: 8.2rem;
  }
}


/* prBox */
.prBox {
    border-top: 2px solid #e8e8e8;
    margin-top: 20px;
}
.movie-wrap {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.movie-wrap iframe {
    position: absolute;
    top: 0;
    left: 10%;
    width: 100%;
    height: 100%;
    margin: 0!important;
    max-width: 80%!important;
    max-height: 80%!important;
}
@media screen and (max-width: 600px) {
.movie-wrap iframe {
    left: 2.5%;
    width: 95%!important;
    height: 95%!important;
    max-width: 95%!important;
    max-height: 95%!important;
}
}

/* osusumeBox */

.osusumeBox h3 {
    font-size: 1.2rem;
    font-weight: bold;
    padding: 5px 14px 2px;
    text-align: left;
    background: #dcdcdc;
    display: inline-block;
    float: left;
    margin-top: 7px;
}
/* henreihinBox */
.henreihinBox h2 {
	background: #dcdcdc;
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    padding: 5px 14px;
    float: left;
}
.henreihinBox h3 {
    font-size: 1.2rem;
    font-weight: bold;
    padding: 5px 14px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

}
@media screen and (max-width: 600px) {
.henreihinBox h2,.henreihinBox h3 {
    font-weight: normal;
}
}
/* jichitaiBox */
.jichitaiBox .card {
	padding-top: 20px;
	padding-right: calc(20px - 0.75rem);
	padding-bottom: 20px;
	padding-left: calc(20px - 0.75rem);
	background: #fafafa;
}
.jichitaiBox h3 {
	background: #00896c;
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    padding: 5px 14px;
    float: left;
    color: #f1f1f1;
}
@media screen and (max-width: 600px) {
.jichitaiBox .card {
	padding-top: 15px;
	padding-right: calc(15px - 0.75rem);
	padding-bottom: 15px;
	padding-left: calc(15px - 0.75rem);
}
}
/* searchBox */
.searchBox a{
    position: relative;
}
.searchBox p{
	background-color: rgba(0,0,0,0.5);
    position: absolute;
    width: 100%;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    margin-left: 0%;
    padding: 7px 0px 3px;
    color: #f1f1f1;
    line-height: 2.5rem;
    bottom: calc(50% - 17.5px);
    text-align: center;
    letter-spacing: 0.5rem;
}
/* searchList */
.searchList li {
    display: inline-block;
    width: 23%;
    vertical-align: top;
    font-weight: bold;
    height: 50px;
    line-height: 50px;
    padding-left: 10px;
}

@media screen and (max-width: 1440px) {
.searchList li {
    width: 33%;
}
}

@media screen and (max-width: 992px) {
.searchList ul {
    border-bottom: 1px solid #e2e2e2;
}
.searchList li {
    width: 100%;
    padding-left: 0px;
}
.searchList li a {
    display: block;
    background: #fafafa;
    border-top: 1px solid #e2e2e2;
    height: 50px;
    line-height: 50px;
}
}
/* detailBox */
.detailBox {
	width: 94%;
    margin: 0 auto;
    position: relative;
}
.shikaku-shosai {
    position: absolute;
    right: -7%;
    top: 44px;
    font-size: 54rem;
    color: #f0f0f0;
    z-index: -1;
}
.carouselBox {
    position: relative;;
}
.detailBox .detailNew {
    position: absolute;
    top: -25px;
    right: 7%;
    background: #00896c;
    color: #fafafa;
    width: 53px;
    text-align: center;
    height: 53px;
    z-index: 1;
    transform: rotate(-45deg);
}
.detailBox .detailNew  p {
    transform: rotate(45deg);
    position: absolute;
    top: 15px;
    left: 3px;
}
.detailRight {
	padding: 0 0 0 3%!important;
}
.detailRight .color02 {
    border-bottom: 1px solid #00896c;
    margin-bottom: 5px;
}
.detailComment {
    position: relative;
    overflow: hidden;
    width: 100%;
}
.detailBtn {
    border-top: 1px solid #d3d3d3;
    margin-top: 25px;
    padding-top: 25px;
}
.detailBtn li a {
	text-align: center;
    display: block;
    height: 45px;
    line-height: 45px;
    font-weight: bold;
    transition: .3s ease-out;
}
.detailBtn li .color02 {
    border: 1px solid #00896c;
}
.detailBtn li a.color02.eventOn {
    background: #00896c;
    color: #fafafa;
}
.detailBtn li .color03{
	border: 1px solid #d19826;
}
.detailBtn li a.color03.eventOn {
    background: #d19826;
    color: #fafafa;
}
.detailBtn li .color04{
	border: 1px solid #b93436;
}
.detailBtn li a.color04.eventOn {
    background: #b93436;
    color: #fafafa;
}
.detailTable {
    width: 94%;
    margin: 0 auto;
    position: relative;
}
.tableTitle {
    border-bottom: 3px solid #00896c;
    padding-left: 8px;
}
.shippingMethod {
    position: absolute;
    top: -4px;
    right: 5px;
    margin: 0px;
}
.shippingMethod li {
    display: inline-block;
    margin: 0 5px;
    padding: 2px 7px 1px;
	color: #fafafa;
    background-color: #bfbfbf;
}
.shippingMethod li.bg_color02 {
	background-color: #00896c;
}
.detailTable tr {
    margin-bottom: 20px;
    border-bottom: 1px dashed#dfdfdf;
    padding-bottom: 15px;
}
.detailTable th,
.detailTable td {
    padding: 10px;
}
.detailJichitai {
    padding-top: 12px;
}
.detailJichitai li {
     margin-bottom: 15px;
     border-bottom: 1px dashed #dfdfdf;
	padding-bottom: 15px;
}
.detailJichitai h1,
.detailJichitai h2,
.detailJichitai h3 {
    display: inline-block;
}
.detailJichitai span {
    margin-right: 15px;
}
.btnBig a {
    text-align: center;
    display: block;
    height: 45px;
    line-height: 45px;
    font-weight: bold;
    transition: .3s ease-out;
    border: 1px solid #b93436;
    width: 300px;
    margin: 0 auto 55px;
}
.btnBig .eventOn {
  	background: #b93436;
    color: #fafafa;
}
@media screen and (max-width: 1280px) {
.detailBox .detailNew {
    width: 43px;
    height: 43px;
    top: -21.5px;
    font-size: 1.3rem;
}
.detailBox .detailNew p {
    top: 13px;
    left: 3px;
}
}
@media screen and (max-width: 750px) {
.detailBox .detailNew {
    width: 32px;
    height: 32px;
    top: -16px;
    font-size: 1.0rem;
}
.detailBox .detailNew p {
    top: 9px;
    left: 2px;
}
}
@media screen and (max-width: 600px) {
.shikaku-shosai {
    top: initial;
	bottom: 64px;
    right: -65px;
}
.detailRight {
	padding: 0!important;
}
.shippingMethod {
    position: static;
    top: initial;
    right: initial;
    margin: 16px 0 12px 12px;
}
}
@media only screen and (min-width: 0) {
  .shikaku-shosai{
    font-size: 34rem;
  }
}
  /* 600px以降から、100pxごとに大きくなる */
@media only screen and (min-width: 600px) {
  .shikaku-shosai{
    font-size: calc(21.250em + 100 * (100vw - 600px) / 600);
  }
}
/* 1,600px以上は固定  */
@media only screen and (min-width: 1600px) {
  .shikaku-shosai{
    font-size: 54rem;
  }
}

/* tabs  */
.tabs{
    overflow-x: hidden;
}
.tabs .tab {
    width: 50%;
    color: #fafafa;
}
.tabs .tab a {
	color: #fafafa;
    font-weight: bold;
}
.tabs .indicator {
    background-color: #fafafa;
}
.bg_color02 .tabs .tab {
    background: #26ab8f;
}
.bg_color02 .tabs .tab a:hover, .bg_color02 .tabs .tab a.active {
    background-color: #00896c;
    color: #fafafa;
}
.bg_color03 .tabs .tab {
    background: #f3c25f;
}
.bg_color03 .tabs .tab a:hover, .bg_color03 .tabs .tab a.active {
    background-color: #d19826;
    color: #fafafa;
}

/* ここから下1/23追記 */
/* areaBox  */
.areaBox {
    width: 98%;
    margin: 0 auto;
}
.areaBox .card-title {
    padding: 15px;
}
.areaBox .card-title h1 {
    padding-left: 0.5rem;
    min-height: 32px;
}
.areaBox .card-reveal .card-title i {
    position: absolute;
    right: 0px;
    top: 0px;
    padding: 7px;
    border-radius: 50%;
    margin: 10px 10px 0px 0px;
    font-size: 3.5rem;
    vertical-align: middle;
    color: rgb(25, 118, 210);
    width: inherit;
}
.areaBox .card-content h2 {
    font-size: 1.5rem;
    margin-top: 0;
    letter-spacing: 0.6rem;
    margin-bottom: 25px;
}
.areaBox .card-content h3 { 
    font-size: 1.5rem;
    font-weight: bold;
}
.areaBox .collapsible h3 {
    font-size: 1.5rem;
    margin: 0;
    line-height: 1.5;
}
.areaBox .collapsible h4 {
    font-size: 1.5rem;
    margin: 20px 0 0 0;
}
.areaBox .card-content li {
    padding-left: 15px;
    text-indent: -15px;
}
.areaBox .collapsible {
    margin: 0;
    box-shadow: none;
    border-right: none;
    border-left: none;
}
.areaBox #yoko .collapsible-body {
    border-left: 1px solid #e8e8e8;
    border-right: 1px solid #e8e8e8;
    min-height: 357px;
}
.areaBox #contact-card .collapsible-header {
    padding: 10px 15px;
    margin: 0;
}
.areaBox #contact-card #yoko li:nth-child(odd){
    border-top: 1px solid #ddd;
    margin-top: -1px;
}
.areaBox .collapsible-body {
    overflow: hidden;
    padding: 2rem;
}
.areaBox .collapsible-body a {
	display: block;
    height: 45px;
    line-height: 45px;
}
.areaBox h2.active {
    background-color: rgba(0, 0, 0, 0.08);
    color: #00896c;
}
.areaBox .card-content h2 .font18 {
    letter-spacing: 0rem;
}


.areaBox .btn-move-up {
    top: 428px;
    right: 10px;
    margin-bottom: 0;
    position: absolute;
}

@media only screen and (max-width: 640px) {
.areaBox #contact-card .collapsible-header {
    padding: 10px 7px;
}
}
@media only screen and (max-width: 600px) {
.areaBox #contact-card .collapsible-header {
    padding: 10px 15px;
}
.areaBox .btn-move-up {
    top: 278px;
    right: 10px;
    margin-bottom: 0;
    position: absolute;
}

.areaBox #contact-card #yoko li:nth-last-child(2) .collapsible-header {
    border-bottom: 1px solid #ddd;
}
.areaBox #contact-card .card-title {
    padding: 15px 20px;
}
.areaBox #contact-card .card-title i {
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 2.2rem!important;
}
.areaBox #contact-card .card-title h1 {
    font-size: 2.2rem;
    min-height: 23px;
}
.areaBox #yoko .collapsible-body {
    min-height: initial;
}
}

/* jichiDetail */
.jichiDetail {
    width: 94%;
    margin: 0 auto;
    position: relative;
}
.jichiLogo {
    padding: 25px;
    background: #fff;
}
.jichiDetail .collapsible  li {
	padding: 0px;
    margin: 0;
    border: none;
}
.jichiDetail .collapsible li .collapsible-header {
	height: 5rem;
    line-height: 5rem;
}
.jichiDetail .detailJichitai .pd0 li {
    border-bottom: none;
    padding-bottom: 0;
}
.detailJichitai .jichiNumber {
	margin-bottom: 35px;
}
.detailJichitai .jichiNumber span {
	margin: 0;
}
@media only screen and (max-width: 600px) {
.detailJichitai .jichiNumber {
	margin-bottom: 15px;
    border-bottom: 1px dashed #dfdfdf;
    padding-bottom: 15px;
}
}
/* ranking */
.rankingNumber {
    text-align: center;
    margin-bottom: 5px;
    letter-spacing: 0.2rem;
    background: #eee;
    font-weight: 500;
}
.ranking h2 {
	background: none!important;
    font-size: initial!important;
    display: block!important;
    padding: 0!important;
    float: none!important;
    margin: 0!important;
}
.ranking h3 {
    padding: 10px 0 0 0!important;
    border-top: 1px dashed#dfdfdf!important;
    margin-top: 7px!important;
}
/* osusumeList */
.osusumeList h2 {
	background: none!important;
    font-size: 1.6rem!important;
    display: block!important;
    padding: 0!important;
    float: none!important;
    margin: 0 0 5px 0!important;
    font-weight: 500!important;
}
.osusumeList h3 {
    background: #dcdcdc;
    display: inline-block;
    padding: 5px 14px!important;
}
@media only screen and (max-width: 992px) {
.osusumeList h2 {
    font-size: 1.5rem!important;
}
}
@media only screen and (max-width: 600px) {
.osusumeList h2 {
    font-size: 1.4rem!important;
}
}

/* freeBox & newsBox & recommendBox */
.freeBox {
    margin: 0 auto;
    max-width: 75%;
    padding: 35px;
}
.newsBox,
.recommendBox,
.staticBox,
.useDetailBox {
    width: 94%;
    margin: 0 auto 50px;
}
.newsBox h2 {
    text-align: center;
    color: #fafafa;
    background: #d19826;
    font-weight: 500;
	padding: 3px 0 1px;
}
.recommendBox h2 {
    text-align: center;
    color: #fafafa;
    background: #00896c;
    font-weight: 500;
		padding: 3px 0 1px;
}

.newsBox .freeBox,
.recommendBox .freeBox,
.useDetailBox .freeBox {
    max-width: 100%!important;
    width: 100%!important;
}
@media only screen and (max-width: 992px) {
.freeBox {
    max-width: 85%;
    padding: 25px;
}
.newsBox .detailBtn {
    margin-top: 15px;
    padding-top: 15px;
}
}
@media only screen and (max-width: 600px) {
.freeBox {
    max-width: 94%;
    padding: 15px;
}
}
/* use */
.useBox .card {
	padding-top: 20px;
	padding-right: calc(20px - 0.75rem);
	padding-bottom: 20px;
	padding-left: calc(20px - 0.75rem);
	background: #fafafa;
}
.useBox h3 {
	background: #00896c;
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    padding: 5px 14px;
    float: left;
    color: #f1f1f1;
}
.counts {
    min-width: 50px;
    display: inline-block;
    text-align: center;
    font-size: 4rem!important;
}
.barCounts {
	transition: 2.5s ease-out;
    height: 23px;
    width: 0%;
    background: linear-gradient(white, #d4d4d4);
    margin-top: -36px;
    margin-bottom: 5px;
}
.useDetailBox .tShadow {
    text-align: center;
    color: #fafafa;
    background: #b93436;
    font-weight: 500;
	padding: 3px 0 1px;
}
@media screen and (max-width: 600px) {
.useBox .card {
	padding-top: 15px;
	padding-right: calc(15px - 0.75rem);
	padding-bottom: 15px;
	padding-left: calc(15px - 0.75rem);
}
}
/* promotion */
.bigG {
    background: url("/test/images/promotion_01.jpg") no-repeat 0% 0% fixed;
    background-size: cover;
    position: relative;
}
.bigG::after{
	content: "";
    display: block;
    position: absolute;
    top: 3%;
    left: 3%;
    width: 94%;
    height: 94%;
    background: rgba(0, 0, 0, 0.3);
}
.bigG .leftTitle {
    position: absolute;
    top: 9%;
    left: 7%;
    z-index: 1;
}

.bigG .text01 {
    color: #fafafa;
    font-weight: bold;
    text-align: center;
}
.bigG .text02 {
	position: absolute;
    top: 6%;
    right: 6%;
    z-index: 1;
    font-size: 5.5rem;
    width: 86px;
    text-align: center;
    color: #fafafa;
}
.bigG .leftBottomTitle {
    position: absolute;
    bottom: 6%;
    right: 6%;
    z-index: 1;
    text-align: right;
    color: #fafafa;
    font-weight: bold;
}
    
@media only screen and (min-width: 0) {
  .bigG .shikaku-shikaku {
  	   font-size: 9rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 31px;
    left: -14px;
    font-size: 1.7rem;
    width: 167px;
  }
}
@media only screen and (min-width: 320px) {
  .bigG .shikaku-shikaku {
  	   font-size: 9rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 31px;
    left: -14px;
    font-size: 1.5rem;
    width: 189px;
    padding-left: 10px;
  }
}
@media only screen and (min-width: 375px) {
  .bigG .shikaku-shikaku {
		font-size: 10rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 19px;
    left: -14px;
    font-size: 1.4rem;
    width: 126px;
  }
}
@media only screen and (min-width: 450px) {
  .bigG .shikaku-shikaku {
		font-size: 11rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 20px;
    left: -22px;
    font-size: 1.6rem;
    width: 152px;
  }
}
@media only screen and (min-width: 600px) {
  .bigG .shikaku-shikaku {
		font-size: 12rem;
  }
  .bigG .text01 {
	position: absolute;
    top: 25px;
    left: -14px;
    font-size: 1.6rem;
    width: 142px;
  }
}
@media only screen and (min-width: 750px) {
  .bigG .shikaku-shikaku {
		font-size: 14rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 35px;
    left: -14px;
    font-size: 1.7rem;
    width: 167px;
  }
}
@media only screen and (min-width: 992px) {
  .bigG .shikaku-shikaku {
		font-size: 16rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 46px;
    left: -14px;
    font-size: 2rem;
    width: 183px;
  }
}
@media only screen and (min-width: 1280px) {
  .bigG .shikaku-shikaku {
		font-size: 19rem;
  }
  .bigG .text01 {
    position: absolute;
    top: 64px;
    left: -14px;
    font-size: 2.0rem;
    width: 217px;
   }
}
@media only screen and (min-width: 1600px) {
  .bigG .shikaku-shikaku {
		font-size: 21rem;
  }
  .bigG .text01 {
  		position: absolute;
		top: 48px;
    	left: -20px;
		font-size: 2.5rem;
		width: 247px;
	}
}
@media screen and (max-width: 992px) {
.bigG {
	display: none;
}
}
@media screen and (max-width: 375px) {
.bigG .text02 {
    position: absolute;
    top: 6%;
    right: 6%;
    z-index: 1;
    font-size: 4rem;
    width: 66px;
    text-align: center;
    color: #fafafa;
}
}
/* promotionBox */
.promotionBox .shikaku-shikaku {
	display: none;
}
.promotionBox h1 {
	padding: 0;
}
.promotionBox h2 {
	font-weight: bold;
	border-bottom: 1px solid #a7a7a7;
    padding-bottom: 2px;
    margin-bottom: 10px!important;
}
.promotionBox .breadcrumbs {
    padding: 0;
}
@media screen and (max-width: 992px) {
.promotionBox .shikaku-shikaku {
	display: block;
}
.promotionBox h1 {
	padding-left: 5rem;
}
}

/* promotionBBox */
.promotionBBox .card {
	padding-top: 20px;
	padding-right: calc(20px - 0.75rem);
	padding-bottom: 20px;
	padding-left: calc(20px - 0.75rem);
	background: #fafafa;
}
.promotionBBox #refund h1 {
    margin: 15px 0 10px;
}
.promotionBBox #refund h2 {
	background: none;
    font-size: 1.5rem;
    display: block;
    padding: 0;
    float: none;
	border-bottom: 1px solid #a7a7a7;
	margin-bottom: 10px;
}
.promotionBBox #refund h3 {
	overflow: initial;
    text-overflow: initial;
    white-space: initial;
    padding: 0;
    font-size: 1.4rem;
    font-weight: 500;
}
.promotionBBox #refund h4 {
	background: #00896c;
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    padding: 5px 14px;
    float: left;
    color: #f1f1f1;
}
.promotionBBox .movie-wrap {
    margin-top: 2.5%;
}
.promotionBBox .movie-wrap iframe {
    left: 0%;
    max-width: 100%!important;
    max-height: 100%!important;
}
@media screen and (max-width: 992px) {
.promotionBBox .detailRight {
	padding: 0!important;
}
}
@media screen and (max-width: 600px) {
.promotionBBox .card {
	padding-top: 15px;
	padding-right: calc(15px - 0.75rem);
	padding-bottom: 15px;
	padding-left: calc(15px - 0.75rem);
}
.promotionBBox .movie-wrap iframe {
	width: 100%!important;
    height: 100%!important;
}
}
/*=================================================================================
     owl-carousel
====================================================================================*/
/* 
 * 	Default theme - Owl Carousel CSS File
 */
.owl-theme .owl-nav {
  margin-top: 10px;
  text-align: center;
  -webkit-tap-highlight-color: transparent; }
  .owl-theme .owl-nav [class*='owl-'] {
    color: #FFF;
    font-size: 14px;
    margin: 5px;
    padding: 4px 7px;
    background: #D6D6D6;
    display: inline-block;
    cursor: pointer;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px; }
    .owl-theme .owl-nav [class*='owl-']:hover {
      background: #869791;
      color: #FFF;
      text-decoration: none; }
  .owl-theme .owl-nav .disabled {
    opacity: 0.5;
    cursor: default; }
.owl-theme .owl-nav.disabled + .owl-dots {
  margin-top: 10px; }
.owl-theme .owl-dots {
  text-align: center;
  -webkit-tap-highlight-color: transparent; }
  .owl-theme .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
    *display: inline; }
    .owl-theme .owl-dots .owl-dot span {
      width: 13px;
      height: 13px;
      margin: 5px 7px;
      background: #303030;
      display: block;
      -webkit-backface-visibility: visible;
      -webkit-transition: opacity 200ms ease;
      -moz-transition: opacity 200ms ease;
      -ms-transition: opacity 200ms ease;
      -o-transition: opacity 200ms ease;
      transition: opacity 200ms ease;
      -webkit-border-radius: 30px;
      -moz-border-radius: 30px;
      border-radius: 30px; }
    .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
      background: #d19826; }

/* 
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  -webkit-animation-duration: 1000ms;
  animation-duration: 1000ms;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }
.owl-carousel .owl-animated-in {
  z-index: 0; }
.owl-carousel .owl-animated-out {
  z-index: 1; }
.owl-carousel .fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut; }

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

/* 
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height {
  -webkit-transition: height 500ms ease-in-out;
  -moz-transition: height 500ms ease-in-out;
  -ms-transition: height 500ms ease-in-out;
  -o-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out; }

/* 
 *  Core Owl Carousel CSS File
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1;
	margin: 0; }
  .owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y; }
  .owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0; }
  .owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    /* fix for flashing background */
    -webkit-transform: translate3d(0px, 0px, 0px); }
  .owl-carousel .owl-item {
    position: relative;
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; }
  .owl-carousel .owl-item img {
    display: block;
    width: 100%;
    -webkit-transform-style: preserve-3d; }
  .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled {
    display: none; }
  .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot {
    cursor: pointer;
    cursor: hand;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel.owl-loaded {
    display: block; }
  .owl-carousel.owl-loading {
    opacity: 0;
    display: block; }
  .owl-carousel.owl-hidden {
    opacity: 0; }
  .owl-carousel.owl-refresh .owl-item {
    display: none; }
  .owl-carousel.owl-drag .owl-item {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
  .owl-carousel.owl-grab {
    cursor: move;
    cursor: -webkit-grab;
    cursor: -o-grab;
    cursor: -ms-grab;
    cursor: grab; }
  .owl-carousel.owl-rtl {
    direction: rtl; }
  .owl-carousel.owl-rtl .owl-item {
    float: right; }

/* No Js */
.no-js .owl-carousel {
  display: block; }

/* 
 * 	Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  -webkit-transition: opacity 400ms ease;
  -moz-transition: opacity 400ms ease;
  -ms-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  transition: opacity 400ms ease; }
.owl-carousel .owl-item img {
  transform-style: preserve-3d; }

/* 
 * 	Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000; }
.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  -webkit-transition: scale 100ms ease;
  -moz-transition: scale 100ms ease;
  -ms-transition: scale 100ms ease;
  -o-transition: scale 100ms ease;
  transition: scale 100ms ease; }
.owl-carousel .owl-video-play-icon:hover {
  -webkit-transition: scale(1.3, 1.3);
  -moz-transition: scale(1.3, 1.3);
  -ms-transition: scale(1.3, 1.3);
  -o-transition: scale(1.3, 1.3);
  transition: scale(1.3, 1.3); }
.owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none; }
.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
  -webkit-transition: opacity 400ms ease;
  -moz-transition: opacity 400ms ease;
  -ms-transition: opacity 400ms ease;
  -o-transition: opacity 400ms ease;
  transition: opacity 400ms ease; }
.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%; 
}

/*=================================================================================
    Media Queries
====================================================================================*/

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* STYLES GO HERE */
  .doughnut-chart-status{
    display: none;
  } 
}

 
/* For Tables ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* STYLES GO HERE */
  .doughnut-chart-status{
    display: none;
  }
  #card-stats .card-stats-compare{
      font-size: 0.8rem;
  }
}