@charset "utf-8";

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

/* module
-------------------------------------------------------*/
body {
}
.pc {
display: none;
}
.sp {
display: block;
}
#wrapper {
width: 100%;
overflow-x: hidden;
}
.inner {
width:100%;
max-width:100%;
}
.area {
padding:30px 20px;
}
h3>span {
font-size: 110%;
}
h3>span>span {
display: inline-block;
}
h3>b::after {
content: "";
display: block;
width: 30px;
height: 2px;
background: #39b14a;
margin: 10px auto 30px;
}

h3>b {
font-size: 80%;
}
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
&::-webkit-search-decoration {
display: none;
}
&::focus {
outline-offset: -2px;
}
}

/* header
-------------------------------------------------------*/
#header .logo img {
max-width: 60px;
}


/* nav
-------------------------------------------------------*/
#menu_btn {
top: 15px;
}

/* footer
-------------------------------------------------------*/
#footer {
padding:30px 20px 100px;
}
#footer .logo img {
max-width: 60px;
margin:0 auto;
}
#footer .box {
width: 100%;
margin: 25px auto;
font-size: 70%;
justify-content: space-around;
}

/* visual
-------------------------------------------------------*/
#visual {
background: none;
padding: 0;
padding-left: 0;
}
#visual h2 img {
max-width: 100%;
}

/* banner
-------------------------------------------------------*/


/* area01
-------------------------------------------------------*/
#area01 .mincho {
font-size: 100%;
}

/* area02
-------------------------------------------------------*/
#area02 h3>span {
line-height: 1;
margin-bottom:10px;
}
#area02 ul {
margin-top: 30px;
justify-content: center;
}
#area02 ul li {
padding:10px;
box-sizing: border-box;
}
#area02 ul li img {
max-width: 150px;
}

/* area03
-------------------------------------------------------*/
#area03 ul li {
margin: 60px auto;
}
#area03 ul li::after {
bottom: -30px;
}
#area03 ul li .text_box {
padding-left: 20px;
}
#area03 ul li .image img {
max-width: 185px;
width: 185px;
}
#area03 ul li .text_box .title {
font-size: 100%;
margin-bottom:10px;
}
#area03 ul li .text_box .text {
font-size: 90%;
line-height: 1.2;
}
@media screen and (max-width: 500px) {
#area03 ul li {
flex-flow: column nowrap;
align-items: center;
}
#area03 ul li .text_box {
padding-top:20px;
padding-left: 0;
}
#area03 ul li .text_box .title {
text-align: center;
}
#area03 ul li .text_box .title br {
display: none;
}
}

/* area04
-------------------------------------------------------*/
#area04 ul {
justify-content: center;
margin: 30px auto 0;
}
#area04 ul li {
padding:0 10px;
}
#area04 ul li img {
max-width: 100px;
}
#area04 .text {
font-size: 90%;
}
/*#area04 .text br:first-child {
display: none;
}*/
#area04 .title b {
font-size: 100%;
}

/* area05
-------------------------------------------------------*/
#area05 .box {
padding: 20px;
margin-bottom: 30px;
}
#area05 h4 {
font-size: 130%;
margin-bottom: 10px;
}
#area05 .box .title {
font-size: 110%;
margin-bottom: 5px;
}
#area05 dl > * {
padding: 5px;
width:50%;
}
#area05 dl dt {
font-size: 50%;
}
#area05 dl dd {
padding-right: 10px;
font-size: 100%;
}

/* area06
-------------------------------------------------------*/
#area06 .pc {
display: none;
}
#area06 .image {
max-width:336px;
margin: auto;
}
#area06-2 h4 {
font-size: 100%;

}



#area06-2 dl {
	display: block;
	width: 100%;
	border-bottom: 1px solid #d6d6d6;
	padding-bottom: 15px;
	margin-top: 15px;
	font-size: 90%;
}

#area06-2 dl dt{
	display:block;
	width: 100%;
	margin-bottom: 10px;
}

#area06-2 dl dd{
	display:block;
	width: 100%;
}


/* area07
-------------------------------------------------------*/
#area07 .text {
font-size: 100%;
margin-bottom: 30px;
}
#area07 .contact img {
max-width:215px;
}
#area07 .tel img {
max-width:215px;
}
#area07 ul li {
padding: 0 10px;
}

/* company
-------------------------------------------------------*/
#company .dlist01 {
background: none;
padding-bottom: 20px;
display: table;
width: 100%;
box-sizing: border-box;
}
#company .dlist01 dl dt, #company .dlist01 dl dd {
display: block;
width: 100%;
padding: 10px;
}
#privacy .privacy_box {
width: 100%;
padding: 0 20px;
}
#security .security_box {
width: 100%;
padding: 0 20px;
}
#privacy.area, #copyright.area, #security.area {
padding: 15px 0;
}

/* contact
-------------------------------------------------------*/
#contact .ttl-txt {
font-size: 90%;
line-height: 1.2;
}
#contact tr {
width: 100%;
}
#contact tr > * {
padding: 15px;
display: block;
}
#contact tr th {
width: 100%;
background-position: right center;
border-right: 0;
}
#contact tr td span {
font-size: 80%;
}
#contact tr:last-child th {
background-position: right center;
}
#contact .text {
height: 30px;
}
#contact .contact-btn {
font-size: 100%;
padding: 10px;
width: 80%;
margin: 30px 5px 0;
display: block;
}
#contact .back-btn {
font-size: 100%;
padding: 10px;
width: 80%;
margin: 30px 5px 0;
display: block;
}


.pan {
	display: none;
}


/* @media screen
-------------------------------------------------------*/

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