@charset "utf-8";

/*=====================================================================================
	
	Document    : common-s.css
	Description : 共通css スマホ用（幅640px以下）

	1-1. Header
	1-2. Nav
	1-3. Contents
		 3-1. Side
		 3-2. Main
	1-4. Footer
 
=====================================================================================*/

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

   1-1. Header

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

.hd-sp {
	/*padding:5% 3%;*/
}

@media screen and (max-width:420px) {
	.hd-sp {
		/*padding:6% 3%;*/
		padding:3%;
	}
}


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

   2-1. Nav

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

/*-------------------------------------------------------
   SP
-------------------------------------------------------*/

.gnav-sp {
	padding:6% 6% 7% 6%;
}

.gnav-sp-close img {
	max-width:14%;
	height:auto;
}

@media screen and (max-width:420px) {
	.gnav-sp {
		padding:7% 7% 8% 7%;
	}
	
	.gnav-sp dt {
		padding:15px 0;
		background-size:15% !important;
	}
}


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

   1-3. Contents

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

/*-------------------------------------------------------
   各ブロック
-------------------------------------------------------*/

@media screen and (max-width:420px) {
	.ct .block {
		padding-top:8%;
		padding-bottom:8.5%;
	}
}


/*-------------------------------------------------------
   見出し
-------------------------------------------------------*/

@media screen and (max-width:420px) {
	.ct .block .md {
		background-size:auto 30%;
	}
}


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

   1-4. Footer

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

/*-------------------------------------------------------
   pageup
-------------------------------------------------------*/

.up {
	display:none !important;
}


/*-------------------------------------------------------
   contact-btn
-------------------------------------------------------*/

.contact-btn {
	display:none !important;
}


/*-------------------------------------------------------
   nav
-------------------------------------------------------*/

footer ul {
	padding-left:3%;
	padding-right:3%;
	padding-bottom:1.5%;
}

footer li {
	width:25%;
	float:left;
	margin-left:0;
	margin-right:0;
}

footer li img {
	max-width:70% !important;
}


@media screen and (max-width:420px) {
	footer ul {
		padding-bottom:1%;
	}

	footer li img {
		max-width:80% !important;
	}
	
	footer li {
		font-size:11px;
	}
}


/*-------------------------------------------------------
   logo・address
-------------------------------------------------------*/

footer h6 {
	padding-bottom:0;
}
	
footer .tel {
	padding-left:3%;
	padding-right:3%;
	padding-top:6%;
	color:#3c3c3c;
}

footer .tel a {
	display:block;
	padding:3%;
	background-color:#fff;
	border-bottom-width:4px;
	border-bottom-style:solid;
	border-bottom-color:rgba(0,0,0,0.25);
}

footer .tel span {
	background:url(../image/ft/ic-tel-on.png) no-repeat left center;
}

@media screen and (max-width:640px) {
  footer .cc {
    background:url(../image/ft/cc-bg.png) repeat-x center center;
  }

  footer .cc > div {
    background:url(../image/bg-black50.png) repeat center top;
    padding:0 1.5em;
  }

  footer .cc br,
  footer address br,
  footer .tel br {
    display:none;
  }

  footer .cc span,
  footer address span,
  footer address {
    margin-right:1em;
  }

  footer h6 {
    padding-top:0.75em;
  }

  footer .tel {
    margin-left:1em;
  }

  footer .tel span {
    display: inline-block;
    font-weight:bold;
    margin-left:0.5em;
    background:url("../image/ft/ic-freetel-on.png") no-repeat left center;
    padding:3px 0 3px 50px;
    vertical-align:middle;
  }

  footer .tel a,
  footer .tel a:visited,
  footer .tel a:hover { text-decoration:none; color:#3c3c3c !important; }
}


@media screen and (max-width:480px) {
	footer .tel br {
		display:inherit;
	}
	
	footer .tel span {
		margin-left:0;
		margin-top:0.25em;
	}
}
	
@media screen and (max-width:420px) {
	footer .cc {
		background:none;
		border-top-width:1px;
		border-top-style:solid;
		border-top-color:rgba(255,255,255,0.25);
		padding-top:8%;
	}
	
	footer .cc br {
		display:inherit;
	}

	footer .cc span {
		margin-right:0;
	}

	footer h6 {
		padding-top:0.5em;
	}
	
	footer address br {
		display:inherit;
	}

	footer address span,
	footer address {
		margin-right:0;
	}

	footer .tel {
		margin-left:0;
	}

	footer .tel a {
		padding:4%;
	}
}

/*-------------------------------------------------------
   under-fixed-menu
-------------------------------------------------------*/

.under-fixed-menu{
  position: fixed;
  z-index: 8999;
  bottom:0;
}

.under-fixed-menu ul{
  display: flex;
  list-style: none;
}

.under-fixed-menu ul li{
  width: calc(100vw/4);
  height: 60px;
  background-color:#3c3c3c;
  box-sizing: border-box;
  position: relative;
}

.under-fixed-menu ul li a{
  color: #fff;
  text-decoration: none;
  position:absolute;
  text-align: center;
  top: 50%;
  left:50%;
  transform: translateX(-50%) translateY(-50%);
  width: 100%;
  height: 100%;
}

.under-fixed-menu ul li a::before{
  content: "";
  width: 20px;
  height: 20px;
  display:block;
  margin: 10px auto 5px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.under-fixed-menu ul li:nth-child(1) a::before{
  background-image: url("../image/ic-logo.png");
}

.under-fixed-menu ul li:nth-child(2) a::before{
  background-image: url("../image/ic-tel-white.png");
}

.under-fixed-menu ul li:nth-child(3) a::before{
  background-image: url("../image/ic-siryou.png");
}

.under-fixed-menu ul li:nth-child(4) a::before{
  background-image: url("../image/md-ic/contact-w.png");
}

.under-fixed-menu ul li:not(:last-child){
  border-right: 1px solid #666666;
}

@media screen and (max-width:640px) {
  footer {
    margin-bottom: 60px;
  }
}

/*-------------------------------------------------------
   .scroll-nav
-------------------------------------------------------*/

.scroll-nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.scroll-nav::-webkit-scrollbar {
    display:none;
}

.scroll-nav ul{
    display: flex;
	align-items: center;
    list-style-type: none;
    padding: 0;
    text-align: center;
	/* position:relative;*/
}

.scroll-nav li{
    display: flex;
	flex-wrap: nowrap;
	box-sizing: border-box;
    background:#fff;
	padding-bottom: 5px;
}

.scroll-nav li:not(:last-child)::after{
    content:"|";
	color:rgba(102,102,102,0.5);
	opacity: 0.5;
	padding-top: 5px;
	font-size:15px;
}

.scroll-nav li a{
    width: 100%;
    white-space: nowrap;
	padding: 6px 10px;
    text-decoration:none;
	font-size:15px;
	color: #666;
}

.pc-block{
	display: none;
}

.sp-block{
	display: block;
}