@charset "utf-8";
/* ============================================================ */
/* 基本設定 */
/* ============================================================ */
html {
	font-size: 62.5%;
}

body {
	color: #000;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	font-weight: normal;
	text-align: left;
	line-height: 1.8;
}
body {
	-webkit-text-size-adjust: 100%;
}

#wrap {
	font-size: 16px;
	font-size: 1.6rem;
	min-width: 1000px;
	overflow: hidden;
	margin-bottom: -20px;
}

.cf { zoom: 1; }

.cf:after {
	display: block;
	clear: both;
	content: "";
}

input,
select,
textarea,
button {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

input:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 1000px white inset;
}

p {
	margin: 15px 10px;
}



/*----- .noscript -----*/

.noscript {
	padding: 6px 0;
	background: #f6f7f7;
}

.noscript p {
	width: 980px;
	margin: 0 auto;
	padding: 0 0 0 28px;
	background: url(/apps/settings/wcm/designs/31sumai/common/img/icon_note.png) 0 center no-repeat;
	box-sizing: border-box;
	font-size: 14px;
	font-size: 1.4rem;
}

.noscript p,
.noscript p a {
	color: #ff0000;
}

.noscript p a:hover {
	text-decoration: none;
}

.colorbox_inline_content{
	display: none;
}

/* ============================================================ */
/* リンク設定 */
/* ============================================================ */
a {
	color: #000;
	text-decoration: underline;
}

a:hover {
	color: #34495e;
}

a img {
	display: inline-block;
}

a:hover img {
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}

.mgt0 { margin-top: 0 !important; }

.mgb0 { margin-bottom: 0 !important; }

.pdt0 { padding-top: 0 !important; }

.pdb0 { padding-bottom: 0 !important; }






/* ============================================================ */
/* .common parts */
/* ============================================================ */

/********************************* btn *********************************/
.c-btn{
	position: relative;
	display: inline-block;
	border-radius: 4px;
	font-size: 1.4rem;
	line-height: 1.8;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
	box-sizing: border-box;
}
.c-btn:after{
	content: "\f0da";
	position: absolute;
	top: 50%;
	margin-top: -0.5em;
	display: inline-block;
	font-family: FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transform: translate(0, 0);
	line-height: 1;
}
/* primary btn */
.c-btn_navy{
	background: #34495e;
	color: #fff;
}
.c-btn_navy i{
	color: #fff;
}
.c-btn_navy:hover{
	background: #656ca7;
	color: #fff;
}
/* cancel btn */
.c-btn_lightnavy{
	background: #e8e9f2;
	color: #34495e;
}
.c-btn_lightnavy i{
	color: #34495e;
}
.c-btn_lightnavy:hover{
	background: #efeff2;
	color: #34495e;
}
/* more btn */
.c-btn_white_border{
	background: #fff;
	color: #000;
	text-decoration: underline;
	border: solid 1px #cdcdcd;
}
.c-btn_white_border:after{
	color: #34495e;
	height: 0.98em;
	overflow: hidden;
	text-decoration: none;
}
.c-btn_white_border:hover{
	background: #f6f6f6;
	color: #34495e;
}
/* disable */
.c-btn_disable{
	cursor: default;
	background: #ddd;
	color: #666;
}
.c-btn_disable i{
	color: #666;
}
.c-btn_disable:hover{
	background: #ddd;
	color: #666;
}
/* size l */
.c-btn.c-btn_l{
	font-size: 1.6rem;
	font-weight: bold;
	padding: 15px 55px 15px 45px;
}
.c-btn.c-btn_l.c-btn_i_rvc{
	padding: 15px 45px 15px 55px;
}
.c-btn.c-btn_l:after{
	right: 15px;
}
/* size m(defaul) */
.c-btn,
.c-btn.c-btn_m{
	padding: 10px 40px 10px 30px;
}
.c-btn.c-btn_i_rvc,
.c-btn.c-btn_m.c-btn_i_rvc{
	padding: 10px 30px 10px 40px;
}
.c-btn:after,
.c-btn.c-btn_m:after{
	right: 10px;
}
/* size s */
.c-btn.c-btn_s{
	font-size: 1.2rem;
	padding: 5px 35px 5px 25px;
}
.c-btn.c-btn_s.c-btn_i_rvc{
	padding: 5px 25px 5px 35px;
}
.c-btn.c-btn_s:after{
	right: 10px;
}
/* size ss */
.c-btn.c-btn_ss{
	font-size: 1.0rem;
	padding: 2px 22px 2px 15px;
}
.c-btn.c-btn_s.c-btn_i_rvc{
	padding: 2px 15px 2px 22px;
}
.c-btn.c-btn_ss:after{
	right: 5px;
}
/* アコーディオン */
.c-btn.c-btn_accordion:after{
	content: "\f067";
}
.c-btn.c-btn_accordion.c-btn_accordion_close:after{
	content: "\f00d";
}
/* アイコン無し */
.c-btn.c-btn_none:after{
	content: "";
}
.c-btn.c-btn_none.c-btn_ss{
	padding-right: 15px;
}
/* 別ウィンドウ */
.c-btn.c-btn_external:after{
	content: "\f08e";
}
.c-btn.c-btn_external:before{
	display: none;
}
/* 削除 */
.c-btn.c-btn_remove:after{
	content: "\f00d";
}
/* 検索 */
.c-btn.c-btn_search:after{
	position: relative;
	content: "\f002";
	top: auto;
	right: auto;
	margin-top: 0;
}
/** rotate **/
.c-btn.c-btn_i_rvc:after{
	-moz-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}
/* size l (rotate) */
.c-btn.c-btn_l.c-btn_i_rvc:after{
	right: auto;
	left: 15px;
}
/* size m(defaul) (rotate) */
.c-btn.c-btn_i_rvc:after,
.c-btn.c-btn_m.c-btn_i_rvc:after{
	right: auto;
	left: 10px;
}
/* size s (rotate) */
.c-btn.c-btn_s.c-btn_i_rvc:after{
	right: auto;
	left: 10px;
}
/* size ss (rotate) */
.c-btn.c-btn_ss.c-btn_i_rvc:after{
	right: auto;
	left: 5px;
}






/* ============================================================ */
/* c-btns */
/* ============================================================ */
.c-btns{
	clear: both;
	text-align: center;
}
.c-btns>*{
	display: inline-block;
	padding: 5px 5px;
}
.c-btns2{
	clear: both;
	text-align: center;
}
.c-btns2>*{
	display: inline-block;
	padding: 5px 5px;
}


/* ============================================================ */
/* new icon */
/* ============================================================ */

/* ============================================================ */
/* responsive */
/* ============================================================ */

.onlysp{
	display: none;
}

a[href^="tel:"]{
	pointer-events: none;
	text-decoration:none;
}




/* ============================================================ */
/* smartphone */
/* ============================================================ */
@media screen and (max-width:640px) {
	img{
		max-width: 100%;
	}
	a:hover img {
		filter: alpha(opacity=100);
		opacity: 1.0;
	}
	#wrap{
		min-width: 0;
	}
	.onlysp{
		display: block;
	}
	.onlypc{
		display: none;
	}



}