﻿
font-family: Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;

.outLine0{
}
.outLine1{
	border-radius: 5px;
	border:solid 1px blue;
	width:94%;
	height:50px;
	margin:3px;
	padding:1px;
	position:relative;
}

@media print{
	.pc_none{
		display:none;
	}
}
.outLine2{
	
	border-radius: 5px;
	border:solid 1px blue;
	width:94%;
	margin:3px;
	
	position:relative;
	overflow:hidden;
}
.parent{
	
	vertical-align:middle;
	position:relative;
}
.bo{
	border:solid 1px black;
}
.now_page{
	border-radius: 5px;
	margin-left:2px;
	padding:1px;
	float:left;
	text-align:center;
	font-weight:bold;
	color:#136CB9;
	
}

.next_page{
	border-radius: 5px;
	text-align:center;
	padding:1px;
	float:left;
	top:50%;
}

.tri{
	top:50%;
	padding-left:10px;
	padding-right:10px;
}

.vcenter{
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	margin:0px;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
}
.cen{
	position:relative;
	display:block;
	width:285px;
	height:50%;
	margin:auto;
}

@media screen and (min-width: 768px) {
	.sp_none{
		display:inline-block;
	}
	.pc_none{
		display:none;
	}
	.left10{
		margin-left:auto;
		margin-right:auto;
		width:60%;
	}
}

@media screen and (max-width: 768px) {
	.sp_none{
		display:none;
	}
	.pc_none{
		display:inline-block;
	}
	.left10{
		margin-left:auto;
		margin-right:auto;
		width:95%;
	}
}

.hissu{
	color:orangered;
	font-weight:bold;
}
.siryo{
	text-align:left;
	margin-right:0px;

}
.siryo_list{
	display:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	padding-right:0px;
	margin-right:0px;
	float:right;
	width:70%;
}
.komoku{
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	text-align:center;
	background:#62DAFF;
	border-right:solid 1px blue;
	float:left;
	width:30%;
	margin-top:auto;
	
}
.comment_str{
	color:darkred;
	font-size:90%;
	padding-left:20px;
	display:inline-block;
}

.box1{
	position:relative;
	min-height:150px;
}
.komoku_chd{
	position:absolute;
	margin-top:auto;
	top:50%;
	left:5px;
}

.head_sub{
	left:50%;
	margin:auto;
	overflow:auto;
}

.kugiri_line{
	border:solid 1px blue;
	border-width: 1px 0 0 0;
}

.komoku1{
	text-indent:10px;
	background:#084488;
	padding:0px;
	line-height:30px;
	color:#FFFFFF;
	font-weight:bold;
}
.margin_b0{
	margin-bottom:0px;
}

.komoku2{
	text-indent:10px;
	background:#084488;
	line-height:30px;
	color:#FFFFFF;
	font-weight:bold;
}
input[type="text"]{
	border-radius: 5px;
	margin-left:10px;
	font-size:16px;
}
input[type="tel"]{
	border-radius: 5px;
	margin-left:10px;
	font-size:16px;
}
input[type="email"]{
	border-radius: 5px;
	margin-left:10px;
	font-size:16px;
}
.select_b2{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #136CB9;
	background:-webkit-linear-gradient(top, #fff 0%,#FFaaFF 100%);
	background: linear-gradient(#fff, #FFaaFF);
}

.select_b1{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #136CB9;
	background:-webkit-linear-gradient(top, #fff 0%,#aaFFFF 100%);
  background: linear-gradient(#fff, #aaFFFF);
}

.select_none{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #136CB9;
	background:-webkit-linear-gradient(top, #fff 0%,#888888 100%);
  background: linear-gradient(#fff, #888888);
}
 
.select_b3{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid #136CB9;
	background:-webkit-linear-gradient(top, #fff 0%,#FFaaFF 100%);
  background: linear-gradient(#fff, #FFaaFF);
	vertical-align:middle;
}
.bg_gps{
	margin:0;
	padding:0;
	width:150%;
	height:200%;
	background:-webkit-linear-gradient(top, #fff 0%,#FFaaFF 100%);
  background: linear-gradient(#fff, #FFaaFF);
}
.err_div{
	font-size:12px;
	line-height:22px;
	background:-webkit-linear-gradient(top, #FFFF00 0%, #fff 100%);
  background: linear-gradient(#FFFF00, #fff);
	color:darkred;
	font-weight:bold;
	width:90%;
	border-radius: 5px;
	border:solid 1px blue;
	margin-left:10px;
	padding:2px;
	visibility:hidden;
	position:absolute;
	padding-top:2px;
	padding-bottom:2px;
}
.custom_sel{
	height:2.0em;
	width:90%;
	margin-left:10px;
	border-radius:5px;
	text-indent:20px;
	font-size:120%;
}
.form_result{
	margin-left:10px;
	padding-top:5px;
	padding-bottom:5px;
	font-size:12px;
	line-height:16px;

}
.metal_selector li{
	position:relative;
	float:left;
	width:64px;
}

.metal_selector .test{
	width:150px;
}
.metasele{
	position:relative;
	left:50%;

  -webkit-transform: translateX(-50%); /* Safari用 */
  transform: translateX(-50%);

}
.metal_selector{
	padding-left:0;

	list-style-type:none;
}
.metal_selector li input
{
	position:absolute;
	top:0;
	left:0;
	opacity:0;
}

.metal_selector li label{
	display:block;
	padding:10px;
	height:25px;
	border:1px solid #cccccc;
//	background-image:linear-gradient(#ffffff, #888888);
	background:linear-gradient(#ffffff, #888888);
	background:-webkit-linear-gradient(top, #fff 0%,#888888 100%);　//Android標準ブラウザの古いタイプで有効になる
	text-align:center;
	font-weight:bold;
	text-shadow:0 1px 0 #ffffff;
	box-shadow:0 2px 2px rgba(0,0,0,0.15);

}

.metal_selector .test label {
	height:15px;
}

.metal_selector li + li label{
	border-left-width:0;
}

.metal_selector li:first-child label{
	border-radius:10px 0 0 10px;
}

.metal_selector li:last-child label{
	border-radius:0 10px 10px 0;
}

.metal_selector li input:checked + label{
//	background-image:linear-gradient(#FFaaFF, #ffffff);
	background:linear-gradient(#FFaaFF, #ffffff);
	background:-webkit-linear-gradient(top, #FFaaFF 0%,#ffffff 100%);
}
.metal_selector_v{
	margin-left:0;
	padding-left:0;
	list-style-type:none;
}
.metal_selector_v li input
{
	position:absolute;
	opacity:0;
}

.metal_selector_v li label{
	display:block;
	padding:10px;
	padding-top:20px;
	height:15px;
	border:1px solid #cccccc;
	background:linear-gradient(#ffffff, #888888);
	background:-webkit-linear-gradient(top, #ffffff 0%,#888888 100%);
	text-align:center;
	font-weight:bold;
	text-shadow:0 1px 0 #ffffff;
	box-shadow:0 2px 2px rgba(0,0,0,0.15);
}

.metal_selector_v .test label {
	height:25px;
}

.metal_selector_v li + li label{
	border-bottom-width:0;
}

.metal_selector_v li:first-child label{
	border-radius:10px 10px 0 0;
}

.metal_selector_v li:last-child label{
	border-radius:0 0 10px 10px;
}

.metal_selector_v li input:checked + label{
	background:linear-gradient(#FFaaFF, #ffffff);
	background:-webkit-linear-gradient(top, #FFaaFF 0%,#ffffff 100%);
}
.vcentring{
	position:relative;
	top:50%;
	-webkit-transform: translateY(-50%); /* Safari用 */
	transform:translateY(-50%);
}

.text_oc {
    font-size: 12pt;
    line-height: 21px;
    padding: 20px;

    /* テキストエリアに陰をつける */
    box-shadow: 0.2em 0.2em 0.5em black;

    /* 罫線描画（各ブラウザ対応）*/
    background-image: -webkit-linear-gradient(left, white 10px, transparent 10px), -webkit-linear-gradient(right, white 10px, transparent 10px), -webkit-linear-gradient(white 20px, #ccc 20px, #ccc 21px, white 21px);
    background-image: -moz-linear-gradient(left, white 10px, transparent 10px), -moz-linear-gradient(right, white 10px, transparent 10px), -moz-linear-gradient(white 20px, #ccc 20px, #ccc 21px, white 21px);
    background-image: -ms-linear-gradient(left, white 10px, transparent 10px), -ms-linear-gradient(right, white 10px, transparent 10px), -ms-linear-gradient(white 20px, #ccc 20px, #ccc 21px, white 21px);
    background-image: -o-linear-gradient(left, white 10px, transparent 10px), -o-linear-gradient(right, white 10px, transparent 10px), -o-linear-gradient(white 20px, #ccc 20px, #ccc 21px, white 21px);
    background-image: linear-gradient(left, white 10px, transparent 10px), linear-gradient(right, white 10px, transparent 10px), linear-gradient(white 20px, #ccc 20px, #ccc 21px, white 21px);
    background-size: 100% 100%, 100% 100%, 100% 21px;
    /* 淡いグレーで枠線を囲む */
    border: 1px solid #ccc;
}

