@charset "utf-8";
/* CSS Document */

.header.change-color{
	background-color: rgba(0,0,0,0.5);
}

#mainvisual{
	width: 100%;
	height: 300px;
	background-image: url(../img/profile/philosophy/header.jpg);
	position: relative;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
#mainvisual::after{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: #000;
	opacity: 0.2;
}
.main-title{
	width: 100%;
	position: absolute;
	top: 48%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	font-family: U-OTF-GothicMB101Upr-Heavy;
	font-size: 250%;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	z-index: 9;
	text-align: center;
}

.main-text{
	width: 100%;
	position: absolute;
	top: 72%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	font-family: U-OTF-GothicMB101Upr-Heavy;
	font-size: 110%;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	z-index: 9;
	text-align: center;
}

.submain-title{
	position: absolute;
	top: 73%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	font-family: U-OTF-GothicMB101Upr-Heavy;
	font-size: 120%;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	z-index: 9;
	text-align: center;
}


/* パンくずリスト */
#pan_box{
	width: 1100px;
	height: 35px;
	margin: 0 auto;
}
#pan_list{
	height: 35px;
	color: #DDD;
	background-color: rgba(0,0,0,0.8);
	position: absolute;
	bottom: -10px;
	z-index: 99;
	padding-right:30px;
}
ol.topic_path{
	list-tyle-type: none;
	line-height: 35px;
	font-size: 77%;
	letter-spacing: 1px;
	padding-left: 30px;
}
ol.topic_path li{
	display: inline;
}
ol.topic_path li.first{
	position: relative;
}
ol.topic_path li.first::after{
	content: '';
  	position: absolute;
    top: 30%;
	right: 3px;
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
	transform: rotate(45deg);
}
ol.topic_path li.second{
	padding-left: 5px;
}
ol.topic_path li a{
	padding-right: 20px;
	color: #fff;
	text-decoration: underline;
}
ol.topic_path li a:hover{
	color: #fff100;
}


#wrapper{
	width:100%;
	height:auto;
	background:#f7f7f7;
}



/*----------------------------

			content01
			
------------------------------*/

.content01{
	padding: 60px 0;	
}


.title01{
    font-size: 200%;
    text-align: center;
    letter-spacing: 1px;
    padding: 20px 0 20px;
    font-family: U-OTF-GothicMB101Upr-Heavy;
	text-shadow: 2px 2px 2px #ddd;
}


/*「環境依存文字」の注意*/
.kankyo{
	margin:0 auto;
	width:1100px;
	color:#C00;
	font-size:100%;
	margin-top:10px;
	margin-bottom:10px;
	line-height:1.8;
	text-indent:-1.5em;
    padding-left:1.5em;
}

.black{
	color:#535353;
}

/*///////　テーブル　/////////*/
.red{
	color:#F00;
}
.bunya{
	margin:10px 0;
}

#table_box01{
    width: 1100px;
	margin:0 auto;
}
table.listing_price03 {
	border-collapse: collapse;
	text-align: left;
	border-top: 2px solid #ddd;
	border-left:2px solid #ddd;
}
table.listing_price03 th {
	width: 320px;
	padding:10px 15px;
	color: #00467e;
	border-right: 2px solid #ddd;
	border-bottom: 2px solid #ddd;
}
table.listing_price03 td.centaer_box{
	width:770px;
	background:#FFF;
	padding:10px 15px;
	font-size:93%;
	text-align:left;
	border-right: 2px solid #ddd;
	border-bottom: 2px solid #ddd;
	color: #535353;
	
}
input[type="text"], textarea {
    background: none repeat scroll 0 0 #F9F9F9;
    border: 1px solid #CCCCCC;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1) inset;
}
span.hissu{
	color:#F60;
	padding-left:5px;
	font-size:77%;
}
.centaer_box01{
	width:750px;
	background:#FFF;
	padding:10px 15px;
	font-size:100%;
	text-align:left;
	border-right: 2px solid #ddd;
	border-bottom: 2px solid #ddd;
	color: #535353;
}

/*郵便番号が分からない方はこちら*/
span.yubin a{
	color:#177691;
	text-decoration:underline !important;
}
span.yubin a:hover{
	color:#F60;
}

/*チェックボックス縦並び*/
.check{
	position:relative;
	top:3px;
}
.centaer_box01 strong{
	padding-top:10px;
	display:block;
}

/*確認・リセットボタン*/
#btn_box{
	margin-top:50px;
	width:1100px;
	height:45px;
	text-align:center;
	line-height:45px;
}

.btn{
	width:95px;
	height:45px;
	background:#535353;
	color:#FFF;
	cursor:pointer;
	font-size:116%;
	-webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
	font-weight:900;
}

.btn_02{
	margin-left:30px;
}

.btn:hover{
	text-decoration:underline;
	-webkit-text-shadow: -1px 1px 4px #FFF, 1px -1px 4px #FFF;
	-moz-text-shadow: -1px 1px 4px #FFF, 1px -1px 4px #FFF;
	-ms-text-shadow: -1px 1px 4px #FFF, 1px -1px 4px #FFF;	
    text-shadow: -1px 1px 4px #FFF, 1px -1px 4px #FFF;	
}

/* Tooltip */
.tooptip-body{
	position: absolute;
	padding: 10px 10px;
	letter-spacing:1px;
	font-size:116%;
	border: 2px solid #F93;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background: #fff;
	color:#F93;
	box-shadow: 0 1px 1px rgba(0,0,0, .4);
}

select.box_size{
	font-size:116%;
	font-weight:800;
	width:210px;
	height:40px;
	color:#535353;
}

/* クリックしたらフォームの淵が光る */
td.custom input[type="text"],
td.custom textarea {
	outline: none;
	border: 1px solid #aaa;
	-webkit-transition: all .3s;
	transition: all .3s;
}

td.custom input[type="text"]:focus,
td.custom textarea:focus {
	box-shadow: 0 0 7px #F93;
	border: 1px solid #F93;
}

span.bun{
	color:#00467e;
	font-weight:bold;
	line-height:35px;
	text-align:start;
}

.kibou{
	padding-top:10px;
	color:#F00;
}

.kibou a{
	padding-top:10px;
	color:#535353;
	text-decoration:underline !important;
}

.dateselector-year{
	height:35px;
	margin-right:10px;
	font-size:108%;
	margin-bottom:10px;
}

.dateselector-month{
    height:35px;
	margin-right:10px;
	font-size:108%;
}

.dateselector-day{
    height:35px;
	font-size:108%;
}

/*///////　ここまでテーブル　/////////*/
.text_under{
	width:570px;
	margin:40px auto;
	border:1px solid #535353;
	padding:10px 20px;
	color:#535353;
}

.text_under a{
	text-decoration:underline !important;
	color:#535353;
}



.accordion  {
  margin: 30px auto;
}

.accordion_title {
    position:relative;
    cursor: pointer;
    letter-spacing: 1px;
    font-size: 100%;
    padding: 6px 10px; 
    text-align: left;
    background: #eee;
    color: #535353;
    width: 126px;
}

summary.accordion_title::-webkit-details-marker {
  display:none;
}

.accordion_title:after {
  content: "+";
  position: absolute;
  top: calc(50% - 0.5em);
  right: 10px;
  line-height: 1;
  padding: 0;
  pointer-events: none;
  font-size:100%;
}

.accordion::details-content {
  opacity: 0;
  block-size: 0;
  transition: .3s;
  transition-property: display, opacity, block-size, padding;
  transition-behavior: allow-discrete;
  line-height: 1.6em;
}

.accordion .accordion_content {
  padding: 0 2em 0 3em;
}

.accordion .accordion_content > *:first-of-type {
  margin-top: 0;
}

.accordion .accordion_content > *:last-of-type {
  margin-bottom: 0;
}

.accordion[open]::details-content {
  opacity: 1;
  block-size: auto;
  block-size: calc-size(auto, size);
}

.accordion[open] .accordion_content {
  padding: 1.4em 2em 1.4em 3em;
}

.accordion[open] .accordion_title:after {
  content: "-";
}
