/*2020.11*/

@media screen and (max-width : 768px) {

body {
	font-family:'Lato', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size: 14px;
	line-height: 1.7;
	letter-spacing: 0;
}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}



/*ヨコにしても文字サイズを変えない none*/
html {-webkit-text-size-adjust: none;}
/*アンカーリンク　すむーず*/
html {scroll-behavior: smooth;
   scroll-padding-top: 30px;
}

img {
    max-width: 100%;
    height:auto;
}



.pcDisplay {display:none; height:0;}
.spDisplay {display:block;}


/*----------------------------------------------------
	BOX
----------------------------------------------------*/

body{
	font-size:0.8rem;
	}

h1 a:hover{
	filter: saturate(150%);
transition: 0.5s linear;
}

#splash-logo{
    font-size: 0.8rem;
	white-space: nowrap;
    
    text-transform: uppercase;
    color: #d0151c;
}
	
	
/* lead */
.top-lead{
	position: fixed;
	top: 300px;
	left:30px;
	height: 220px;
	width: auto;	
}


.top-lead img{
	height: 100%;
	width: auto;	
}
	
	
	
/* main-area */

#main-area{
    width:100%;
    margin:0 auto;
    
}



.bx-wrapper{
    box-shadow:none;
    border:none;
}	
	
	


/* about */


section {
	width: 80%;
	margin: 0 auto 0 auto;
}

#about h2 {
	margin-bottom: 40px;
	padding-top: 4px;
}

#about.outer
{
	background: #f4f5f5;
	padding: 50px 0 0 0;
}



section .splits {
	display: flex;
	flex-direction: column-reverse;
		
}

#about .splits figure,
#about .splits .right-box{
	width: 100%;
}

#about .splits .right-box h2 {
	height: 50px;
	width: auto;
	text-align: center;
}

#about .splits .right-box h2 img {
	height: 100%;
	width: auto;
}

#about .splits .right-box dl dt {
	font-size: 1.2rem;
	margin-bottom: 5px;
}

#about .splits .right-box dl dd {
	font-size: 0.875rem;
	margin-bottom: 30px;
}
	
	
	

/*------サービス-----*/


#service.outer
{
	background: #f4f5f5;
	padding: 70px 0 150px 0;
}

#service h2,
#company h2{
	height: 50px;
	width: auto;
	text-align: center;
	margin-bottom: 40px;
}

#service h2 img,
#company h2 img{
	height: 100%;
	width: auto;
}

#service .txt-rexd {
	font-size: 1rem;
	
	margin-bottom: 40px;
}

#service .splits {
	display: block;
		
}


#service .left-box {
	width: 100%;
	padding: 15px 0 20px 0;
	background: #d0151c;
	border-radius: 8px;
	position: relative;
	margin-bottom: 100px;
	
}

#service .left-box aside,
#service .right-box aside
{
	width: 100%;
	text-align: center;
	
}

#service .left-box a.btn {
	width: 250px;
	height: 200px;
	position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;	
}



#service .right-box {
	width: 100%;
	padding: 15px 0 20px 0;
	background: #0e6e38;
	border-radius: 8px;
	position: relative;
}

#service .right-box a.btn {
	width: 290px;
	height: 200px;
	position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;	
}

#service .right-box a.btn:hover,
#service .left-box a.btn:hover
{filter: brightness(150%);
transition: 0.5s linear;
}


#service .splits p {
	width: 80%;
	font-size: 0.8rem;
	color: #fff;
	text-align: center;
	margin: 10px auto 0 auto;
}

#service .right-box ul,
#service .left-box ul
{
	position: absolute;
	bottom: -65px;
	left: 0;
	z-index: 10;
	display: flex;
	justify-content: space-between;
	
	width: 100%;
}

#service .right-box ul li,
#service .left-box ul li
{
	width: 48%;
	list-style: none;
	
}
#service .right-box ul a,
#service .left-box ul a
{
	font-size: 1rem;
	display: block;
	
}

#service ul .line a {
	background: #06c555;
}

#service ul .insta a {
background-image: linear-gradient(55deg, rgba(247, 166, 12, 1) 10%, rgba(255, 34, 87, 1) 40%, rgba(154, 39, 238, 1) 68%, rgba(35, 102, 247, 1) 90%);
}


/*矢印*/
#service ul li {
	position: relative;
}

#service ul li aside.arrow
{
	position: absolute;
	top: 12px;
	right: 15px;
	width: 12px;
	height: auto;
}

#service ul li aside.arrow img {
	width: 100%;
	height: auto;
}

/**/

#service ul .line a,
#service ul .insta a
{
	width: auto;
	text-align: center;
	border-radius: 8px;
	display: block;
	padding-top: 6px;	
}

#service ul a:hover
{filter: saturate(150%);
	 transition: 0.3s linear;

}

#service ul .line a img.btn-name,
#service ul .insta a img.btn-name
{
	height: 22px;
	width: auto;
	margin: 10px 0 6px -20px;
	
	
}
	
	
	


/*-----COMPANY-------*/


#company.outer
{
	background: #e1e1dd;
	padding: 50px 0;
}


#company h3 {
	font-size: 1.0rem;
	font-weight: normal;
	margin-bottom: 10px;
	letter-spacing: 0.2em;
}
	
#company .splits {
	display: block;
		
}
	
#company .left-box {
	width: 100%;
	margin-bottom: 50px;
}

#company .right-box {
	width: 100%
}



#company .company-list dl.first dt,
#company .company-list dl.first dd{
	border-top: 1px solid #000;
	padding-top: 10px;
}

#company .company-list dl {
    display: flex;
    justify-content: space-between;
}

#company .company-list dt,
#company .right-box .company-list dt{
    width: 25%;
	font-size: 0.8rem;
	color: #666;
    padding: 10px 0 10px 5px;
	
	border-bottom: 1px solid #000;
}

#company .company-list dd
 {
    width: 73%;
	 font-size: 0.8rem;
	 color: #666;
	 padding: 10px 0 10px 5px;
	 border-bottom: 1px solid #666;
}


/*沿革*/


#company .right-box .company-list dl {
display: flex;
  flex-wrap: wrap;
  width: 100%;
	font-size: 0.8rem;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
	padding-bottom: 15px;
	padding-top: 5px;
}

#company .right-box .company-list dl dt {
  display: flex;/*センターにするために必要ｓ*/
  align-items: center;
  width: 25%;
  padding: 10px 0 0 0;
	font-weight: normal;
	color: #666;
	border: none;
}

#company .right-box .company-list dl dd {
display: flex;/*センターにするために必要*/
  align-items: center;
  width: 75%;
  margin-left: 0;
  padding: 10px 5px 0 10px;
	border: none;
 
color: #666;	
}
	
	
	
	
/*-----アクセス-------*/


#access.outer
{
	background: #e1e1dd;
	padding: 0 0 80px 0;
}


#access h2 {
	height: 30px;
	width: auto;
	text-align: center;
	margin-bottom: 40px;
}
#access h2 img{
	height: 100%;
	width: auto;
}	
	.iframewrap {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.iframewrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}	
	
	

/* footer */



#footer{
    
   background: #e1e1dd;
}



#footer #name-wrap {
	display: block;
	padding-bottom: 50px;
  position: relative;
  background-color: #e1e1dd;
	z-index:2;
}


#footer .name-box {
    width: 75%;
	margin: 0 auto 0 auto;
}
#footer .name-box img {
    width: 100%;
}
#footer .name-box p {
	font-size: 0.8rem;
	text-align: center;
	margin-bottom: 20px;
	
}

#footer .add-box {
    width: 320px;
	margin: 0 auto 0 auto;
	
}
#footer .add-box p{
    font-size: 0.7rem;
	text-align: center;
}



#footer small{
	display: block;
	background: #d0151c;
	color: #fff;
	text-align: center;
	padding: 10px 0;
	position: relative;
  z-index:2;
}



	
	#page-top a{
	display: flex;
	justify-content:center;
	width: 50px;
	height: 120px;
	transition:all 0.3s;
}
	
	#page-top {
	position: fixed;
	right: -10px;
	bottom:130px;
	z-index: 2;
    /*はじめは非表示*/
	opacity: 0;
	transform: translateX(50px);
}
	





	

/*!! DONT DEL !!*/

}