@charset "utf-8";

.title_area h1 {
    margin-bottom:3px;
}

div.qa {
 width: 960px;
 margin: 0 auto;
}
ul.nav {
 margin: 60px 0 40px 0;
}
ul.nav li {
 float: left;
 width: 50%;
 text-align: center;
 font-size: 18px;
}
ul.nav li a {
 display: block;
 background-color: #f4f4f4;
 text-decoration: none;
 color: #333333;
 padding: 10px 0;
 
 -webkit-transition:	background 0.2s ease;
 transition:			background 0.2s ease;
}
ul.nav li a.current,
ul.nav li a:hover {
 background-color: #f27aa2;
 color: #FFF;
 font-weight: bold;
}

dl.qa_item {
 border: 3px solid #ededed;
 overflow: hidden;
 border-radius: 6px;		
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;	
 padding: 0 0 0 0;
 font-size: 16px;
 margin-bottom: 10px;
}
dl.qa_item:nth-last-child(1) {
 margin-bottom: 60px;
}
dl.qa_item dt {
 background: url(../images/qa_title2.png) no-repeat right center;
 margin: 0 27px;
 color: #666666;
 padding: 20px 0;
 font-weight: bold;
 cursor: pointer;
 border-bottom: 0px solid #d1d1d1;;
}
dl.qa_item dt.active {
 background: url(../images/qa_title.png) no-repeat right center;
 color: #666666;
 font-weight: bold;
 border-bottom: 1px solid #d1d1d1;;
}
dl.qa_item dt span {
 background: url(../images/q.png) no-repeat 0 center;
 line-height: 30px;
 padding: 0 0 0 40px;
 display: block;
}
dl.qa_item dd {
 -webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	transition: all 0.5s;
 max-height: 0;
 overflow: hidden;
 position: relative;
 padding: 0 0 0 70px;
}
 dl.qa_item dd.active {
  max-height: 400px;
  height: auto;
  padding: 30px 0 60px 70px;
 }
	dl.qa_item dd a {
	color: #ee4d83;
	text-decoration: underline;
	}
	dl.qa_item dd a:hover {
	color: #333333;
	text-decoration: none;
	}
dl.qa_item dd figure {
	margin-top: 20px;
}
p.img_l {
 position: absolute;
 left: 0;
 bottom: 0;
}
p.img_r {
 position: absolute;
 right: 25px;
 bottom: 0;
}

.mt1em {
 margin-top: 1em;
}
dl.qa_item dd.pl200 {
 padding-left: 200px;
}
dl.qa_item dd.active.pb50 {
 padding-bottom: 110px;
}
dl.qa_item dd.active.pb80 {
 padding-bottom: 140px;
}
dl.qa_item dd.pl215 {
 padding-left: 215px;
}
dl.qa_item dd.pl230 {
 padding-left: 230px;
}

/* ---------------------------------------------------
 button2
--------------------------------------------------- */
.button2{
	padding:13px 27px 13px;
	display:inline-block;
	box-sizing:border-box;
	font-family:'Quicksand', sans-serif;
	color:#ee4d83;
	font-size:14px;
	font-weight:700;
	line-height:1;
	text-decoration:none;
	border-radius:6px;
	border:solid 2px #e6e6e6;
	background-color:transparent;
	cursor:pointer;
	
	-webkit-transition:	border 0.2s ease;
	transition:			border 0.2s ease;
}
.button2:hover{
	text-decoration:none;
	border:solid 2px #ee4d83;
}



/* ---------------------------------------------------
 exLink
--------------------------------------------------- */
.exLink:after{
	content:"";
	width:16px;
	height:14px;
	margin-left:8px;
	display:inline-block;
	vertical-align:middle;
	background-image:url(../images/icon_exlink.svg);
	background-repeat:no-repeat;
}
/* ---------------------------------------------------
 arrowLink
--------------------------------------------------- */
.arrowLink:after{
	content:"";
	width:7px;
	height:7px;
	margin-left:8px;
	display:inline-block;
	vertical-align:middle;
	background-image:url(../images/icon_arrowlink_r.svg);
	background-repeat:no-repeat;
}
/* --------------------------------------------------
 複数行のellipsis
-------------------------------------------------- */
.ellipsis{
  background-color: #f5f5f5;
  overflow: hidden;
}
.ellipsis p{
  height:78px;	/* 3行分の高さ（26x3） */
  position:relative;
  font-size:16px;
  line-height:26px;
}
.ellipsis p:before,
.ellipsis p:after {
  position: absolute;
  background-color: #f5f5f5;
}
.ellipsis p:before {
  content: "...";
  right:0;
  top:52px;	/* 3行目のy座標（26x2） */
}
.ellipsis p:after {
  content: "";
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 700px) {
div.qa {
 width: auto;
 margin: 0 15px;
}
ul.nav {
 margin: 20px 0;
}
ul.nav li {
 float: left;
 width: 50%;
 text-align: center;
 font-size: 14px;
 line-height: 1.5;
}
ul.nav li a {
 display: block;
 background-color: #f4f4f4;
 text-decoration: none;
 color: #333333;
 padding: 10px 0;
}
ul.nav li a.current,
ul.nav li a:hover {
 background-color: #f27aa2;
 color: #FFF;
 font-weight: bold;
}

dl.qa_item {
 border: none;
 border-top: 3px solid #ededed;
 overflow: hidden;
 border-radius: 0;		
	-webkit-border-radius: 0;
	-moz-border-radius: 0;	
 padding: 0;
 font-size: 14px;
 position: relative;
 margin-bottom: 0;
}
dl.qa_item:nth-last-child(1) {
 margin-bottom: 30px;
}
dl.qa_item dt {
 background: url(../images/qa_title2.png) no-repeat right center;
 margin: 0 0 0 0;
 color: #666666;
 padding: 10px 45px 10px 0;
 font-weight: bold;
 border-bottom: none;
}

dl.qa_item dt span {
 background: url(../images/q.png) no-repeat 0 0;
 background-size: 24px auto;
 min-height: 24px;
 line-height: 1.5;;
 padding: 0 0 0 35px;
 display: block;
}
dl.qa_item dd {
 padding: 0 !important;
 font-size: 13px;
}
 dl.qa_item dd.active {
  padding: 15px 0 !important;
 }
p.img_l {
 position: static;
 text-align: center;
 margin: 10px 0 0 0;
}
p.img_r {
 position: static;
 text-align: center;
 margin: 10px 0 0 0;
}
p.img_l img,
p.img_r img {
 width: 50%;
}
.mt1em {
 margin-top: 1em;
}
dl.qa_item dd figure {
	margin-top: 20px;
	text-align: center;
}
dl.qa_item dd figure a {
	border: 1px solid #EEE;
	padding: 15px 20px;
	display: inline-block;
}
}