@charset "utf-8";

@media screen and (max-width: 768px) {
	* {
		margin: 0;
		padding: 0;
	}

	body {
		font: 13px/1.3 "メイリオ", "Meiryo", arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
		color: #252525;
		background: #fff;
		line-height: 1.5em;
	}

	a {
		color: #00659b;
		text-decoration: none;
	}

	a:hover {
		color: #a5a5a5;
	}

	a:active,
	a:focus {
		outline: 0;
	}

	img {
		border: 0;
	}

	.clear {
		clear: both;
	}

	img {
		max-width: 100%;
		height: auto;
	}

	/*************************
	/* ヘッダー
	*************************/
	.sp-header_bg {
		background-color: #D84685;
		position: relative;
	}

	.sp-header_bg:after {
		position: absolute;
		bottom: 0;
		left: 0;
		display: block;
		content: "";
		width: 100%;
		height: 40%;
		background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
		z-index: 0;
	}

	.sp-icon-bg {
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 26px;
		height: 26px;
		background: #f2f2f2;
		color: #FFF;
		text-decoration: none;
		text-align: center;
		margin: 2px 0;
	}

	.header_sp_logo {
		/* width: 124px; */
		text-align: center;
		margin: 0 auto;
		padding: 12px;
	}

	.sptop-icon img {
		width: 18px;
		display: block;
	}

	a {
		color: #00659b;
		text-decoration: none;
	}

	a:hover {
		color: #a5a5a5;
	}

	a:active,
	a:focus {
		outline: 0;
	}

	img {
		border: 0;
	}

	.clear {
		clear: both;
	}

	/*************************
  全体
*************************/

	#date {
		text-align: right;
		padding-right: 15px;
		padding-top: 15px;
		padding-bottom: 10px;
		font-weight: bold;
		color: #00659b;
	}

	#main1 .boxT p {
		padding: 10px;
		line-height: 1.4em;
		text-align: center;
	}


	.main_box {
		margin-bottom: 10px;
	}

	.main_box2 {
		margin-bottom: 20px;
	}

	/*************************
/* 検索＆ツイッターボタン
*************************/
	.search {
		text-align: center;
		margin: -10px 0 -10px 0;
	}

	.search p {
		list-style: none;
		margin: 2px 1px;
		font-size: 25px;
	}

	.search img {
		margin: 0;
		padding: 0;
	}

	#s {
		height: 40px;
		width: 300px;
		font-size: 30px;
	}

	ul.twbot {
		position: absolute;
		top: 100px;
		right: 10px;
	}

	ul.twbot li {
		text-align: right;
		list-style: none;
		margin: 3px 1px;
	}

	ul.twbot li img {
		margin: 0;
		padding: 0;
	}

	.contact {
		margin-right: 10px;
		background: url(android-images/android-Tel.gif) no-repeat top right;
		width: 100%;
		height: 100%;
	}


	/* SP相談ダイヤルボタン */
	.sp_banner_box3 {
		text-align: center;
	}

	.btn {
		background: #fff3c2;
		border: 1px solid #ccc;
		color: #b34c7b;
		width: 90%;
		margin: 30px auto;
		padding: 15px 0 5px 0;
		text-decoration: none;
		font-weight: bold;
		text-align: center;
		font-size: 12px;
		display: block;
		-moz-border-radius: 40px;
		-webkit-border-radius: 40px;
		line-height: 1.3em;
	}

	.btn img {
		margin-bottom: 5px;
	}

	.btn:hover {
		opacity: 0.6;
	}

	.sp_telbnr:hover {
		opacity: 0.6;
	}

	.list-circle li {
		margin: 0 3px 10px 20px;
		list-style: circle;
	}

	.bannerM {
		margin: 15px 0;
	}

	.bannerM:hover {
		opacity: 0.6;
	}

	.btn_top {
		text-align: right;
		padding-right: 3%;
		margin-bottom: 15px;
	}

	.btn_top:hover {
		opacity: 0.6;
	}

	/* 画像を右に回りこみ */
	/* #index p.withImage {
		width: 100%;
		margin: 10px;
		padding: 5px 0;
	}

	#index p.withImage img {
		float: right;
		margin: 0 10px 0 5px;
} */

	/* .withImage_1 {
		font-size: 13px;
		line-height: 1.8em;
	}

	.cap-s {
		font-size: 10px;
		white-space: nowrap;
} */

	.sp_sidebar {
		display: block;
	}

	.sp_listview {
		margin: 0 0 30px;
	}

	.sp_list-divider {
		border: 1px solid #e0498b;
		background: #e0498b;
		color: #ffffff;
		font-weight: bold;
		text-shadow: 0 1px 0 #444444;
		padding: 7px 10px;
		/* font-size: 15px; */
		border-top-left-radius: 7px;
		border-top-right-radius: 7px;
		text-align: left;
	}

	.sp_list {
		background-color: #F6F6F6;
		color: #2f3e46;
		display: block;
		position: relative;
		text-align: left;
		margin-bottom: 0;
		border: 2px solid #ccc;
		margin-top: -2px;
		background: linear-gradient(to bottom, #fff, #e6e6e6);

	}

	.sp_list::after {
		position: absolute;
		content: "";
		display: block;
		background-image: url("../images/icon_images/arrow_icon.png");
		/* 絶対パスに修正 */
		background-size: 20px 20px;
		/* アイコンサイズを明示 */
		background-repeat: no-repeat;
		width: 20px;
		height: 20px;
		right: 10px;
		top: 50%;
		transform: translateY(-50%);
	}

	.sp_list:hover {
		opacity: 0.5;
	}

	.sp_list a {
		color: #333333;
		font-size: 15px;
		font-weight: bold;
		display: block;
		padding: 12px 10px;
	}

	.sp_list:last-child {
		border-bottom-left-radius: 7px;
		border-bottom-right-radius: 7px;
	}


	/* フッター共通 */
	#footer {
		text-align: center;
	}


	/*************************
サイド（左側）コンテンツ
*************************/
	#sidebar {
		float: left;
		width: 100%;
		padding: 0 0 10px 0;
	}

	#sidebar p {
		margin-bottom: 10px;
	}

	.blog_bnr {
		text-align: center;
	}

	.blog_bnr:hover {
		opacity: 0.6;
	}

	/******** android用・縦向きの場合のみ反映 ********/

	@media only screen and (orientation : portrait) {
		.bannerM ul {
			height: 30px;
			width: 100%;
			font-size: 20px;
			margin: 20px 0 10px 0;
		}

		.bannerM li {
			background: url(android-images/list2.gif) no-repeat 0 0.5em;
			padding-left: 0.5em;
			float: left;
			list-style: none;
			margin-left: 4px;
		}

	}



	/* table
******************************************************/
	table.free_table {
		margin: 0;
		padding: 5px;
	}

	table.free_table th,
	table.free_table td {
		padding: 5px;
	}

	table.base_table {
		margin-top: 20px;
		margin-left: 0px;
		width: 95%;
		border-top: 1px solid #CCC;
	}

	table.base_table th {
		border-bottom: 1px solid #CCC;
		padding: 10px 12px;
		text-align: center;
	}

	table.base_table td {
		border-bottom: 1px solid #CCC;
		padding: 10px 12px;
		border-left: 1px solid #CCC;
		line-height: 180%;
	}

	/* テーブルスタイル参考：th赤バック */
	table.red th {
		background: #a55c67;
		color: #FFF;
	}

	/* テーブルスタイル参考：thうすバック */
	table.light_blue th {
		background: #d7eef6;
		color: #2b408e;
		width: 100px;
	}

	/* テーブルスタイル参考：thグレーバック */
	table.light_gray th {
		background: #EFEFEF;
		color: #000;
		width: 100px;
	}

	.b-red {
		color: #d45582;
		font-weight: bold;
	}

	.cap-red {
		color: #CC0000;
	}

	.cap-big {
		font-size: 120%;
		line-height: 120%;
		font-weight: bold;
	}

	.cap-price {
		font-size: 180%;
		line-height: 120%;
		color: #CC0000;
	}

	.strongs {
		font-weight: bold;
		font-size: 120%;
	}

	.caption {
		font-size: 85%;
		line-height: 120%;
	}
}
