@charset "utf-8";

/*******************
 * PC、スマホ共通
	* タブレット
 * スマホ
*******************/



/* ==================================================================================================================
	 PC、スマホ共通
	 =================================================================================================================== */
/* 吹き出し */
.balloon {
	position: relative;
	display: inline-block;
	padding: 5px 20px;
	width: auto;
	vertical-align: middle;
	color: #000;
	text-align: left;
	background: #fff;
	border: 2px solid #009ef0;
	z-index: 0;
	font-size: 18px;
	border-radius: 5px;
 
	-moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 -o-border-radius: 5px;
 -ms-border-radius: 5px;
	font-weight: normal;
	width: 52%;
	float: right;
	margin-top: -87px;
}

.balloon:before {
	content: "";
	position: absolute;
	top: 50%; left: -9px;
	margin-top: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 9px 9px 9px 0;
	border-color: transparent #fff transparent transparent;
	z-index: 0;
}

.balloon:after {
	content: "";
	position: absolute;
	top: 50%; left: -12px;
	margin-top: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 10px 10px 10px 0;
	border-color: transparent #009ef0 transparent transparent;
	z-index: -1;
}

/* -------------------------------------------------------------------------- 
   PC、スマホ共通-メイン
   ------------------------------------------------------------------------ */
.mainLeft {
 max-width: 820px;
 width: 74.54%;
 margin-top: 50px;
 float: left;
 }

h3 {
	max-width: 560px;
	width: 100%;
	}

.QA {	margin-top: 30px;	}

/* Q */

.QA dt:hover {
	background-color: #ffdddd;
	-webkit-transition: 0.2s ease-in-out;  
 -moz-transition: 0.2s ease-in-out;  
 -o-transition: 0.2s ease-in-out;  
 transition: 0.2s ease-in-out;
	}

/* Q */
.QA dt {
	padding: 15px 10px 15px 15px;
	overflow: hidden;
	cursor: pointer;
	margin-top: 10px;
	background-color: #f2f2f2;
	position: relative;
	}

.QA dt:before {
	display: block;
	content: url(../../qa/img/ic_qa_open.png);
	position: absolute;
	top: 50%;
	right: 5px;
	margin-top: -20px;
 }

.QA dt.icOpen:before {	content: url(../../qa/img/ic_qa_close.png);	}

.QA dt.icClose:before {	content: url(../../qa/img/ic_qa_open.png);	}

.QA dt div.qIc {
 float: left;
 display: block;
 width: 12%;
 font-size: 25px;
 font-weight: bold;
 color:#ff9999;
 line-height:1.0;
	word-break: break-all;
	}

.QA dt div.txt {
 float: right;
 display: block;
 padding-right: 8%;
 width: 80%;
	}

/* A */
.QA dd {
  overflow: hidden;
  padding: 15px 10px 15px 15px;
		display: none;
	}
	
.QA dd div.aIc {
 float: left;
 display: block;
 width: 12%;
 font-size: 25px;
 font-weight: bold;
 color:#009ef0;
 line-height:1.0;
	word-break: break-all;
	}

.QA dd div.txt {
 float: right;
 display: block;
 width: 88%;
	}

/* 右メニュー */
.mainRight {
 max-width: 220px;
 width: 20%;
 margin-top: 50px;
	float: right;
}

.mainRight ul.rightMenu {	border-bottom:solid 1px #bdbdbd; }

.mainRight ul.rightMenu li {	border-top:solid 1px #bdbdbd; }

.mainRight ul.rightMenu li a {
	display: block;
 padding: 28px 5px 28px 30px;
	text-decoration: none;
	position: relative;
	font-size: 25px;
	font-weight: bold;
	color: #b60081;
	line-height: 1.2;
}

.mainRight ul.rightMenu li a:after {
  content:"";
  display:block;
  position:absolute;
  top: 50%;
  left: 0px;
  width: 10px;
  height: 10px;
  margin: -6px 0 0 8px;
  -webkit-transform: rotate(45deg);
  transform:rotate(45deg);
  border-top: solid 1px #b60081;
  border-right: solid 1px #b60081;
}

.mainRight ul.rightMenu li a:hover,
.mainRight ul.rightMenu li a.On {
	background: #ffeaf9;
	-webkit-transition: 0.2s ease-in-out;  
 -moz-transition: 0.2s ease-in-out;  
 -o-transition: 0.2s ease-in-out;  
 transition: 0.2s ease-in-out;
}



/* ======================================================================================================================
	 タブレット
	 =================================================================================================================== */
@media print, screen and (max-width: 1100px) {
/* 吹き出し */
.balloon {
	position: relative;
	display: block;
	padding: 5px 20px;
	width: auto;
	vertical-align: middle;
	color: #000;
	text-align: left;
	background: #fff;
	border: 2px solid #009ef0;
	z-index: 0;
	font-size: 18px;
	border-radius: 5px;
	
	-moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 -o-border-radius: 5px;
 -ms-border-radius: 5px;
	font-weight: normal;
	width: 80%;
	float: none;
	margin: 0 auto 5px auto;
}

.balloon:before {
	content: "";
	position: absolute;
	top: 0px; left: 50%;
	margin-left: -9px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 9px 9px 9px;
	border-color: transparent transparent #fff transparent;
	z-index: 0;
}

.balloon:after {
	content: "";
	position: absolute;
	top: -2px; left: 50%;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #009ef0 transparent;
	z-index: -1;
}

}



/* ======================================================================================================================
	 スマホ
	 =================================================================================================================== */
@media only screen and (max-width: 768px) {
/* 吹き出し */
.balloon {
	margin-top: 10px;
}
	
/* 上メニュー */
.smSubMenu {
	overflow: hidden;
	border: solid 1px #bdbdbd;
	box-sizing: border-box;
	}

.smSubMenu li {
	float: left;
	width: 25%;
	border-right:solid 1px #bdbdbd;
	box-sizing: border-box;
}

.smSubMenu li:nth-child(4) {	border-right: none; }

.smSubMenu li a {
	display: block;
  padding: 5px 5px 5px 10px;
	text-decoration: none;
	position: relative;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.4em;
	color: #b60081;
	text-align: center;
	word-break: keep-all;
}

.smSubMenu li a:after {
  content:"";
  display:block;
  position:absolute;
  top: 50%;
  left: 0px;
  width: 10px;
  height: 10px;
  margin: -6px 0 0 4px;
  -webkit-transform: rotate(45deg);
  transform:rotate(45deg);
  border-top: solid 1px #b60081;
  border-right: solid 1px #b60081;
}

.smSubMenu li a.On {
	background: #ffeaf9;
	-webkit-transition: 0.2s ease-in-out;  
 -moz-transition: 0.2s ease-in-out;  
 -o-transition: 0.2s ease-in-out;  
 transition: 0.2s ease-in-out;
}

/* -------------------------------------------------------------------------- 
   スマホ-メイン
   ------------------------------------------------------------------------ */
.mainLeft {
 width: 100%;
 margin-top: 40px;
 float: none;
 }

/* Q */
.QA dt {
	padding: 10px 0 10px 10px;
	min-height: 20px;
	}

.QA dt:before {
	display: block;
	content: url(../../qa/img/ic_qa_open.png);
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -20px;
 }

.QA dt:hover {	background-color: #f2f2f2; }

.QA dt div.qIc {
	width: 17%;
	font-size: 18px;
	line-height:1.3;
	}

.QA dt div.txt {
 width: 67%;
 font-size: 14px;
	padding-right:15%;
	}

/* A */
.QA dd { padding: 10px 0 10px 10px; }
	
.QA dd div.aIc {
 width: 17%;
	font-size: 18px;
	line-height:1.3;
	}

.QA dd div.txt {
 width: 82%;
 font-size: 14px;
	}
}