@charset "utf-8";

/*---------------------------------------------------------------------
Import CSS
---------------------------------------------------------------------*/
@import url("common/clear.css");
@import url("common/common.css");


/*---------------------------------------------------------------------
layout common
---------------------------------------------------------------------*/
@media only screen and (max-width: 320px) {
article .btn_b {
  width:100%;
}

nav ul li a span {
	display:none !important;
}

}

html{
}

body{
}
article .btn_b {
  width:100%;
  font-size: 1.4rem;
}

nav{
  padding: 20px;
  border-bottom: 1px solid #333333;
	box-sizing:border-box;
}

nav ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

nav ul li{
  font-size: 1.4rem;
  font-weight: bold;
  width: 50%;
}

nav ul li:nth-child(odd){
  padding-right: 10px;
  box-sizing: border-box;
}

nav ul li:nth-child(even){
  padding-left: 10px;
  box-sizing: border-box;
}

nav ul li a{
  text-decoration: none !important;
  position: relative;
  width: 100% ;
  padding: 5px 0;
  height: 45px;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
nav ul li:nth-last-child(-n+2) a{
	padding: 5px 0 0;
}

nav ul li a span{
/*  display: block;*/
}

nav ul li a:before{
  content: "";
  width: 14px;
  height: 14px;
  background: url(../img/common/arrow_w.svg) no-repeat center center #000;
  background-size: auto 80%;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -7px;
}
nav ul li a:hover{
  opacity: 0.7;
}



@media only screen and (min-width: 640px) {
nav ul li a:before{
  content: "";
  width: 14px;
  height: 14px;
  background: url(../img/common/arrow_w.svg) no-repeat center center #000;
  background-size: auto 80%;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -11px;
}

}

@media only screen and (min-width: 1024px) {
article .btn_b {
  width:65%;
  font-size: 1.8rem;
}
nav{
	width:1000px;
	margin:0 auto;
  padding:55px 0;
	border-bottom: none !important;
	box-sizing:border-box;
}

nav ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

nav ul li{
  font-size: 1.8rem;
  font-weight: bold;
  width: auto;
	margin-bottom:35px;
	margin-right:78px;
}
nav ul li:nth-last-child(-n+2){
	margin-bottom:0;
}
nav ul li:last-child{
  margin-left: 37px;
}
nav ul li:nth-child(odd){
  padding-right:0;
  box-sizing: border-box;
}
nav ul li:nth-child(even){
  padding-left:0;
  box-sizing: border-box;
}
nav ul li:nth-child(4n){
	margin-right:0 !important;
}
nav ul li a{
  text-decoration: none !important;
  width: 100%;
  padding:0 1.5em 10px 0 !important;
  height: auto !important;
  box-sizing: border-box;
	display:inline-block !important;
	border-bottom:3px #FFF solid;
  align-items: center;
}
nav ul li a:after{
  content: "";
  width: 12px;
  height: 12px;
  background: url(../img/common/arrow_w.svg) no-repeat center center #000;
  background-size: auto 90%;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -5px;
}
nav ul li a:hover{
	border-bottom:3px #000000 solid;
}
nav ul li:nth-last-child(-n+2) a{
	padding: 5px 0 0;
}
nav ul li a:after{
  content:none !important;
}

nav ul li a:hover{
  opacity:1;
}

}



/*---------------------------------------------------------------------
parts_common
---------------------------------------------------------------------*/
h3.deco {
	font-size: 2.2rem;
	font-weight: bold;
	text-align: center;
}
h3.deco:after{
	width:1.5em;
	content:"";
	margin:0 auto;
	padding-bottom:.5em;
	margin-bottom:1em;
	display:block;
	border-bottom:1px solid #333;
	box-sizing:border-box;
}

h4 {
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom:15px;
}

@media only screen and (min-width: 1024px) {

h3.deco {
	width:100%;
	font-size: 3.2rem;
	font-weight: bold;
	text-align: center;
}
h3.deco:after{
	width:3em;
	content:"";
	margin:0 auto;
	padding-bottom:30px;
	margin-bottom:60px;
	display:block;
	border-bottom:1px solid #333;
	box-sizing:border-box;
}

h4 {
	font-size: 2.4rem;
	font-weight: bold;
	margin-bottom:40px;
}

}

/*---------------------------------------------------------------------
about
---------------------------------------------------------------------*/
@media only screen and (max-width: 320px) {
#about div#town_towel div:first-of-type {
    width: 100%;
    padding: 0 0 15px;
    box-sizing: border-box;
    order: 1;
}
#about div#town_towel > div > div a {
	width:100% !important;
	margin:20px auto 25px;
}
}

#about{
	background:#EEEEEE;
	padding-top:25px;
}
#about > div > img {
	width:100%;
/*	display:block;*/
}
#about > div > div {
	width:100%;
	box-sizing:border-box;
	padding:15px 20px 20px;
}
#about > div > div h4 + p {
	font-size:14px;
	line-height:1.8;
}

#about > div:nth-child(2) {
	background:url(../img/index/sp/h2_02sp.jpg) no-repeat top left;
	background-size:cover;
	padding:45px 20px 35px;
	box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.4);
	box-sizing:border-box;
}
#about > div:nth-child(2) h3{
	font-size: 2.2rem;
	font-weight: bold;
	text-align:center;
	margin-bottom:25px;
	text-shadow:1px 1px 2px #FFF;
}
#about > div:nth-child(2) p {
	font-size:1.6rem;
	font-weight:bold;
	line-height:1.8;
}

#about div#town_towel {
	padding:25px 0;
	background:#FFF;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#about div#town_towel > div > span {
	width:100%;
	order:2;
}
#about div#town_towel > div > span img{
	display:block;
	width:100%;
	height:auto;
	margin-bottom:25px;
}
#about div#town_towel > div > div a {
	width:calc(100% - 40px);
	margin:20px auto 25px;
}
#about div#town_towel > div:first-of-type{
	width:100%;
	padding:0 20px 15px;
	box-sizing:border-box;
	order:1;
}
#about div#town_towel > div:first-of-type > div h4{
}
#about div#town_towel > div:first-of-type > div p {
	font-size:1.6rem;
}

#about div#town_towel > div div:nth-of-type(2){
	width:100%;
  position:relative;
	margin:0 auto;
	padding: 20px 15px;
	order:4;
	border:4px #CCCCCC solid;
	box-sizing:border-box;
}
#about div#town_towel > div div:nth-of-type(2) img {
    display: block;
    width: 50%;
    height: auto;
    margin: 2% auto 5%;
}
#about div#town_towel > div div:nth-of-type(2) p{
	font-size:1.4rem;
	margin:auto;
	font-weight:bold;
	line-height:1.6;
	box-sizing:border-box;
}

@media only screen and (min-width: 640px) {
#about div#town_towel > div div:nth-of-type(2){
	width:100%;
	margin:10% auto 0;
	padding-bottom: 5%;
	display:block;
	text-align:center;
}
#about div#town_towel > div div:nth-of-type(2) img {
	width:20%;
	display:block;
	margin: 2% auto 1%;
	text-align:center;
}
#about div#town_towel > div div:nth-of-type(2) p{
	width: 100%;
	font-size:1.4rem;
	margin:0 !important;
	font-weight:bold;
	line-height:1.8;
	text-align:center;
	box-sizing:border-box;
}
}

@media only screen and (min-width: 1024px) {

#about{
	padding-top:80px;
}
#about > div:first-child {
	width:1000px;
	padding-bottom:85px;
	margin:0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
#about > div > img {
	width:640px;
	height:350px;
	margin-bottom:50px;
}

#about > div > img:nth-of-type(2){
	order:2;
}
#about > div > img:nth-of-type(4){
	order:3;
}
#about > div > img:nth-of-type(6){
	order:6;
	margin-bottom:0 !important;
}

#about > div > div {
	width:300px;
	box-sizing:border-box;
	padding:0 !important;
	margin-bottom:50px;
}

#about > div > div:first-of-type{
	order:1;
}
#about > div > div:nth-of-type(2){
	order:4;
}
#about > div > div:nth-of-type(3){
	order:5;
	margin-bottom:0 !important;
}

#about > div > div h4 + p {
	font-size:1.4rem !important;
	line-height:1.8;
}

#about > div:nth-child(2) {
	background:url(../img/index/pc/h2_02.jpg) no-repeat top left;
	background-size:cover;
	padding:80px 0 82px;
	box-shadow: 0px 0px 7px 1px rgba(0,0,0,0.6);
	box-sizing:border-box;
}
#about > div:nth-child(2) h3{
	width:1000px;
	font-size: 4.6rem;
	letter-spacing:-1px;
	font-weight: bold;
	text-align:center;
	margin:0 auto 30px;
	text-shadow:1px 1px 2px #FFF;
}
#about > div:nth-child(2) p {
	width:1000px;
	margin:0 auto;
	text-align:center;
	font-size:1.7rem;
	color:#333333;
	font-weight:bold;
	line-height:1.8;
}

#about div#town_towel {
	width:100%;
	margin:0 auto;
	padding:40px 0 80px;
	background:#FFF;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.4);
}
#about div#town_towel > div{
	width:1000px !important;
	margin:0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
#about div#town_towel > div > div:first-of-type{
	width:450px;
	padding:0 !important;
	box-sizing:border-box;
	order:1;
}
#about div#town_towel > div > div > div:first-of-type h4{
}
#about div#town_towel > div > div > div:first-of-type p {
	font-size:1.6rem;
}
#about div#town_towel > div > div > a {
	width:425px;
	display:block;
	margin:36px auto 0;
}


#about div#town_towel > div > span {
	width:500px;
	height:auto;
	order:2;
}
#about div#town_towel > div > span img{
	width:100%;
	height:auto;
	display:block;
}

#about div#town_towel > div div:nth-of-type(2){
	width:1000px;
	margin:75px auto 0;
	padding-bottom: 35px;
	display:block;
}
#about div#town_towel > div div:nth-of-type(2) img {
	width: 140px;
	display:block;
	margin: 15px auto 20px;
	text-align:center;
}
#about div#town_towel > div div:nth-of-type(2) p{
	font-size:1.4rem;
	margin:0 !important;
	font-weight:bold;
	line-height:1.6;
	text-align:center;
	box-sizing:border-box;
}

}



/*---------------------------------------------------------------------
product
---------------------------------------------------------------------*/

#product {
	background:#EEEEEE;
	padding-top:25px;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.5);
	box-sizing:border-box;
}
#product > div:first-child {
	width:100%;
	box-sizing:border-box;
	padding:0 20px 25px;
}
#product > div:first-child h4{
	margin-bottom:25px;
	letter-spacing:-1px;
}
#product > div:first-child p {
	font-size:1.4rem;
	font-weight:bold;
	line-height:1.6;
	letter-spacing:-.5px;
}

div[id*="lineup"] {
}
div[id*="lineup"] .lineup_bx {
	padding-top:46%;
	background-repeat:no-repeat;
	background-position:left top;
	background-size:100% auto;
	position:relative;

}
.lineup_bx.mark:before {
    content: "";
    width: 102px;
    height: 120px;
    box-sizing: border-box;
    background-color: #FFF;
    background-image: url(../img/common/logo_imabari_towel.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 74px 88px;
    position: absolute;
    top: 0;
    right: 20px;
}
div[id*="lineup"] .lineup_bx > div {
	background:#666666;
	padding:15px 20px 25px;
	box-sizing:border-box;
}
div[id*="lineup"] > div h5 {
	color:#FFF;
	margin-bottom:15px;
	font-size:2rem;
	text-align:center;
	font-weight:bold;
}
div[id*="lineup"] > div p {
	color:#FFF;
	font-size:1.4rem;
	line-height:1.6;
}

#lineup01 .lineup_bx {
	background-image:url(../img/index/sp/h2_03sp.jpg);
}
#lineup02 .lineup_bx {
	background-image:url(../img/index/sp/h2_04sp.jpg);
}
#lineup03 .lineup_bx {
	background-image:url(../img/index/sp/h2_05sp.jpg);
}
#lineup04 .lineup_bx {
	background-image:url(../img/index/sp/h2_06sp.jpg);
}
#lineup05 .lineup_bx {
	background-image:url(../img/index/sp/h2_07sp.jpg);
}
#lineup06 .lineup_bx {
	background-image:url(../img/index/sp/h2_08sp.jpg);
}
#lineup07 .lineup_bx {
	background-image:url(../img/index/sp/h2_09sp.jpg);
}



div[id*="lineup"] ul {
	padding:20px 20px 25px;
	box-sizing:border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; 
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;

}
div[id*="lineup"] ul li {
	width:48%;
	position:relative;
  padding-bottom: 55px;
}
div[id*="lineup"] ul li:nth-child(n + 3) {
	margin-top:25px;
}
div[id*="lineup"] ul li > img {
	display:block;
	margin-bottom:15px;
	width:100%;
	height:auto;
}
div[id*="lineup"] ul li h6 {
	font-weight:bold;
	font-size:1.6rem;
	line-height:1.2;
	margin-bottom:8px;
}
div[id*="lineup"] ul li h6:before{
	content:"■";
	display:inline-block;
	margin-right:1px;
}
div[id*="lineup"] ul li > span {
	display:block;
	font-size:1.4rem;
	margin-bottom:10px;
}
div[id*="lineup"] ul li p {
	font-size:1.4rem;
	line-height:1.4;
	margin-bottom:14px;
}
div[id*="lineup"] ul li a {
	width:100% !important;
	position:absolute;
	bottom:0;
}

@media only screen and (min-width: 1024px) {

#product {
	background:#EEEEEE;
	padding-top:80px;
	box-sizing:border-box;
}
#product > div:first-child {
	width:100%;
	text-align: center;
	box-sizing:border-box;
	padding:0 20px 55px;
}
#product > div:first-child h4{
	margin:-5px 0 45px;
	font-size: 4.6rem;
}
#product > div:first-child p {
	font-size:1.8rem !important;
	font-weight:bold;
	line-height:1.6;
}

div[id*="lineup"] {
}
div[id*="lineup"] .lineup_bx {
	padding:2% 0 !important;
	box-sizing:border-box;
	background-repeat:no-repeat;
	background-position:right top;
	background-size:cover !important;
}
.lineup_bx.mark:before {
    content: "";
    width: 101px;
    height: 120px;
    background-color: #FFF;
    background-image: url(../img/common/logo_imabari_towel.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 74px 88px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 911px;
    margin: 0 auto auto auto;
}

div[id*="lineup"] .lineup_bx > div {
	width:460px;
	max-height: 230px;
	margin:auto;
	background:rgba(0,0,0, 0.6);
	padding:25px 30px 40px;
	box-sizing:border-box;
}
div#lineup04 .lineup_bx > div {
	width:580px;
}
div#lineup04 .lineup_bx > div h5 {
	letter-spacing: -2px
}
div#lineup04 .lineup_bx > div p {
	padding:0 53px;
}

div[id*="lineup"] .lineup_bx > div h5 {
	color:#FFF;
	margin-bottom:15px;
	font-size:3.2rem;
	text-align:center;
	font-weight:bold;
}
div[id*="lineup"] .lineup_bx > div p {
	color:#FFF;
	font-size:1.4rem;
	line-height:1.6;
}

#lineup01 .lineup_bx {
	background-image:url(../img/index/pc/h2_03.jpg);
}
#lineup02 .lineup_bx {
	background-image:url(../img/index/pc/h2_04.jpg);
}
#lineup03 .lineup_bx {
	background-image:url(../img/index/pc/h2_05.jpg);
}
#lineup04 .lineup_bx {
	background-image:url(../img/index/pc/h2_06.jpg);
}
#lineup05 .lineup_bx {
	background-image:url(../img/index/pc/h2_07.jpg);
}
#lineup06 .lineup_bx {
	background-image:url(../img/index/pc/h2_08.jpg);
}
#lineup07 .lineup_bx {
	background-image:url(../img/index/pc/h2_09.jpg);
}

div[id*="lineup"] ul {
	width:1000px;
	margin:0 auto;
	padding:30px 0 90px;
	box-sizing:border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; 
  -webkit-box-pack:start;
  -ms-flex-pack:start;
  justify-content:flex-start;

}
div[id*="lineup"] ul li {
	width:300px;
	margin-right:50px;
	position:relative;
  padding-bottom: 55px;
}
div[id*="lineup"] ul li:nth-child(n + 3) {
	margin-top:0;
}
div[id*="lineup"] ul li:nth-child(n + 4) {
	margin-top:50px !important;
}
div[id*="lineup"] ul li:nth-child(3n) {
	margin-right:0 !important;
}

div[id*="lineup"] ul li > img {
	display:block;
	margin-bottom:15px;
	width:100%;
	height:auto;
}
div[id*="lineup"] ul li h6 {
	font-weight:bold;
	font-size:1.6rem;
	line-height:1.2;
	margin-bottom:8px;
}
div[id*="lineup"] ul li h6:before{
	content:"■";
	display:inline-block;
	margin-right:1px;
}
div[id*="lineup"] ul li p {
	font-size:1.4rem;
	line-height:1.4;
	margin-bottom:14px;
}
div[id*="lineup"] ul li a {
	width:100% !important;
	position:absolute;
	bottom:0;
}

}


/*---------------------------------------------------------------------
howto
---------------------------------------------------------------------*/

#howto {
}
#howto > div:first-child{
 haight:160px;
 padding:15px 0;
/*	padding-top:31%;
	position:relative;*/
	background-repeat:no-repeat;
	background-position:left top;
	background-size:cover;
	background-image:url(../img/index/sp/h2_10sp.jpg);

 display: flex;
 justify-content: center;
 align-items: center;
 align-content: center;
}
#howto > div:first-child div{
  padding:40px 200px;
/*  width: 320px;
  height: 84%;*/
 padding:10px;
	border:#FFF solid 1px;
	text-align:center;
	box-sizing:border-box;
/*  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);*/
/*
 display: flex;
 justify-content: center;
 align-items: center;
 align-content: center;
*/
}
#howto > div:first-child div h2 {
	width:100%;
	line-height:1.3;
	text-align:center;
	margin-top:2vw;
 margin-bottom:1vh;
	font-weight:bold;
	font-size:6.25vw;
	color:#FFF;
}
#howto > div:first-child div p {
	width:100%;
	font-weight:bold;
	margin-top: 2.2vw;
	line-height:1.5;
	font-size:3.75vw;
	color:#FFF;
}

@media only screen and (min-width: 640px) {

#howto > div:first-child div{
  padding:40px 140px;
/*  height:273px;*/
}
#howto > div:first-child div h2 {
/*  position: absolute;
  top: 26%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);*/
	font-size:3.4rem;
}
#howto > div:first-child div p {
	font-size:1.6rem;
	margin-top:0 !important;
/*  position: absolute;
  top: 61%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);*/

	line-height:1.5;
}

}

#howto > div:nth-child(2){
	padding:25px 20px 20px;
	background-image:url(../img/index/sp/h2_11sp.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	background-size:cover;
	box-sizing:border-box;

}
#howto > div:nth-child(2) > dl {
	background:#FFF;
  border-radius:5px;
	padding:15px 20px;
	box-sizing:border-box;

}
#howto > div:nth-child(2) > dl dt {
	font-size:1.5rem;
	font-weight:bold;
	line-height:1;
	border-bottom:#333333 dashed 1px;
	padding-bottom:10px;
	margin-bottom:10px;
}
#howto > div:nth-child(2) > dl dd {
	font-size:1.3rem;
	margin-bottom:25px;
	line-height:1.6;
}
#howto > div:nth-child(2) > dl dd:last-child{
	margin-bottom:0 !important;
}

@media only screen and (min-width: 1024px) {
#howto {
	box-shadow: 0px 4px 13px 0px rgba(0,0,0,0.6);
}
#howto > div:first-child{
	height:512px;
/*	position:relative;*/
	background-repeat:no-repeat;
	background-position:right top;
	background-size:cover;
	background-image:url(../img/index/pc/h2_10.jpg);
}
#howto > div:first-child div{
  padding:60px 180px;
/*  width: 460px;
  height: 240px;*/
	border:#FFF solid 1px;
	text-align:center;
	box-sizing:border-box;
/*  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);*/
}
#howto > div:first-child div h2 {
	width:100%;
	line-height:1.4;
	text-align:center;
	letter-spacing:-4px;
	margin-top:10px !important;
 margin-bottom:1.8vh;
	font-weight:bold;
/*	font-size:2.2rem;*/
	font-size:4.6rem;
	color:#FFF;
}
#howto > div:first-child div p {
	width:100%;
	font-weight:bold;
	margin-top:10px !important;
	line-height:1.6;
	font-size:1.8rem;
	color:#FFF;
}

#howto > div:nth-child(2){
	width:100%;
	padding:80px 0;
	background-image:url(../img/index/pc/h2_11.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	background-size:cover;
	box-sizing:border-box;

}
#howto > div:nth-child(2) > dl {
	width:1000px;
	margin:0 auto;
	background:#FFF;
  border-radius:5px;
	padding:60px 125px 55px;
	box-sizing:border-box;

}
#howto > div:nth-child(2) > dl dt {
	font-size:2.4rem;
	font-weight:bold;
	line-height:1;
	border-bottom:#333333 dashed 1px;
	padding-bottom:25px;
	margin-bottom:25px;
}
#howto > div:nth-child(2) > dl dd {
	font-size:1.6rem;
	margin-bottom:60px;
	line-height:1.8;
}
#howto > div:nth-child(2) > dl dd:last-child{
	margin-bottom:0 !important;
}


}

/* service
-----------------------------*/
@media only screen and (max-width: 320px) {
article #service .btn_b {
  width:100%;
  font-size: 1.4rem;
}
}

#service {
	padding:25px 20px;
	box-sizing:border-box;
	margin-bottom:5px !important;
}
#service dl {
}
#service dl dt {
	font-size: 1.8rem;
	line-height: 1;
	font-weight: bold;
	border-left: #000 8px solid;
	padding-left: 2px;
	margin-bottom: 20px;
	box-sizing:border-box;
}
#service dl dd {
	font-size:1.4rem;
	margin-bottom:25px;
	line-height:1.6;
}

article #service .btn_b {
  width:90% ;
}
@media only screen and (min-width: 640px) {
article #service .btn_b {
  width:75% ;
}
}

@media only screen and (min-width: 1024px) {
#service {
	width:1000px;
	margin:0 auto;
	padding:80px 0 20px !important;
	box-sizing:border-box;
	margin-bottom:0 !important;
}
#service dl {
}
#service dl dt {
	font-size: 2.2rem;
	line-height: 1;
	font-weight: bold;
	border-left: #000 8px solid;
	padding-left: 2px;
	margin-bottom: 30px;
	box-sizing:border-box;
}
#service dl dd {
	font-size:1.6rem;
	margin-bottom:40px;
	line-height:1.6;
}
}
/* question
-----------------------------*/
@media only screen and (max-width:320px) {
#question {
	padding:25px 20px 0 !important;
	box-sizing:border-box;
	margin-bottom:35px !important;
}
#question ul li {
  font-size: 14px;
  position: relative;
  margin-bottom:15px !important;
}
#question ul li:nth-child(even) {
	width:100% !important;
	margin:auto 0 30px 0 !important;
}

}

#question {
	padding:25px 20px;
	box-sizing:border-box;
	margin-bottom:35px !important;
}
#question h3 {
	font-size:22px;
	font-weight:bold;
	text-align:center;
}
#question ul {

}
#question ul li {
	font-size:14px;
	position:relative;
	margin-bottom:25px;
}
#question ul li:last-child{
	margin-bottom:0 !important;
}
#question ul li > span {
	display:block;
	font-weight:bold;
	padding-left:40px;
}
#question ul li:after{
	content:"Q";
	color:#FFF;
	font-weight:bold;
	display:inline-block;
	background:#333333;
	padding:4px 8px;
	border-radius: 3px;        /* CSS3草案 */  
	-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 3px;   /* Firefox用 */  
	position:absolute;
	left:0;
	top:-4px;
}
#question ul li:nth-child(even) {
	width: calc(100% - 40px);
	margin:auto 0 40px auto;
}
#question ul li:nth-child(even):after{
	content:"A";
	background:#ff4a5c;
}

@media only screen and (min-width: 1024px) {
	
#question {
	width:1000px;
	margin:0 auto;
	padding:80px 0 0 !important;
	box-sizing:border-box;
	margin-bottom:0 !important;
}
#question h3 {
	font-size:2.8rem;
	font-weight:bold;
	text-align:center;
}
#question ul {

}
#question ul li {
	font-size:1.8rem;
	position:relative;
	margin-bottom:52px;
}
#question ul li:last-child{
	margin-bottom:0 !important;
}
#question ul li > span {
	display:block;
	font-weight:bold;
	padding-left:63px;
}
#question ul li:after{
	content:"Q";
	color:#FFF;
	font-size:2.2rem;
	font-weight:bold;
	display:inline-block;
	background:#333333;
	padding:4px 13px;
	border-radius: 3px;        /* CSS3草案 */  
	-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 3px;   /* Firefox用 */  
	position:absolute;
	left:0;
	top:-8px;
}
#question ul li:nth-child(even) {
	font-size:1.6rem;
	width: calc(100% - 63px);
	margin:auto 0 88px auto !important;
}
#question ul li:nth-child(even):after{
	content:"A";
	background:#ff4a5c;
}

}

/* guide
-----------------------------*/
@media only screen and (max-width:320px) {
article #service .btn_b {
  width:100%;
  font-size: 1.4rem;
}
#guide .btn_b {
	letter-spacing:-.5px;
}
}

#guide {
	padding:25px 20px 10px;
	box-sizing:border-box;
	margin-bottom:15px !important;
}
#guide h3 {
	font-size:2.2rem;
	font-weight:bold;
	text-align:center;
}
#guide dl {
}
#guide > dl > dt{
	font-size:18px;
	line-height:1;
	font-weight:bold;
	border-left:#000 8px solid;
	padding-left:2px;
	margin-bottom:7px;
}
#guide > dl > dt:last-of-type{
	margin-bottom:4px !important;
}

#guide > dl > dd {
	font-size: 1.4rem;
	margin-bottom: 30px;
	line-height: 1.8;
}
#guide > dl > dd > dl {
	margin-top:12px;
}
#guide dl > dd > dl > dt {
	font-size:16px;
	font-weight:bold;
	margin-bottom:1px;
}
#guide dl > dd > dl > dd {
	margin-bottom:12px;
}
#guide dl > dd > dl > dd:last-child {
	margin-bottom:10px !important;
}

#guide > dl > dd a.ar_wh {
	font-size:14px;
	background-position:97% 51%;
}

article #guide .btn_b {
  width:100% ;
}

@media only screen and (min-width: 640px) {
article #guide .btn_b {
  width:75% ;
}
}

@media only screen and (min-width: 1024px) {
#guide {
	width:1000px;
	margin:0 auto;
	padding:80px 0 0 !important;
	box-sizing:border-box;
	margin-bottom:0 !important;
}
#guide h3 {
	font-size:2.8rem;
	font-weight:bold;
	text-align:center;
}
#guide dl {
}
#guide > dl > dt{
	font-size:2.2rem;
	line-height:1;
	font-weight:bold;
	border-left:#000 8px solid;
	padding-left:2px;
	margin-bottom:25px;
}
#guide > dl > dt:last-of-type{
	margin-bottom:4px !important;
}

#guide > dl > dd {
	font-size:1.6rem;
	line-height:1.8;
	margin-bottom:50px;
}
#guide > dl > dd > dl {
	margin: 25px 0;
}
#guide dl > dd > dl > dt {
	font-size:1.6rem;
	font-weight:bold;
	margin-bottom:1px;
}
#guide dl > dd > dl > dd {
	margin-bottom:6px;
}
#guide dl > dd > dl > dd:last-child {
	margin-bottom:0 !important;
}

#guide > dl > dd a.ar_wh {
	font-size:14px;
	background-position:97% 51%;
}

}