@charset "utf-8";

/*********************************************************************
sakaioffice Co.,LTD.
COMMON STYLES
*********************************************************************/

/* BASE --------------------------------------------------------------------------------------------*/

body{
	margin: 0;
	padding: 0;
	color: #222;
	background: #fff url(common/bg.gif) repeat-x 0 0;
	line-height: 1.8;
	text-align: center;
	font-size: 85%;
	font-family: Meiryo, Verdana, "メイリオ", "ＭＳ Ｐゴシック", Hiragino Kaku Gothic Pro, Osaka;
}
a{ color: #003d8b; text-decoration: none; outline: none;}
a:hover{ color: #1d6fb4; text-decoration: underline;}

.str1{ font-size: 105%; font-weight: bold;}
.str2{ font-size: 120%; font-weight: bold;}
.str3{ font-size: 150%; font-weight: bold;}
.sml1{ line-height: 170%; font-size: 90%;}
.sml2{ line-height: 160%; font-size: 80%;}
.read{ font-size: 110%;}

.idt1{ margin: 0 0 0 3em; text-indent: -1.5em;}
.idt2{ margin: 0 0 1em 2em; text-indent: -2em;}
.idt1 p, .idt2 p{ margin: 0;}
.cap{
	margin: 5px 0 0;
	line-height: 1.7;
	font-size: 95%;
}

.bd_g1{ padding: 0 0 0.5em; border-bottom: solid 1px #ddcf99;}
.bd_g2{ padding: 0 0 0.5em; border-bottom: solid 2px #ddcf99;}
.bd_g3{ padding: 0 0 0.5em; border-bottom: solid 3px #ddcf99;}
.bd_b1{ padding: 0 0 0.5em; border-bottom: solid 1px #003d8b;}/*blue*/
.bd_b2{ padding: 0 0 0.5em; border-bottom: solid 2px #003d8b;}/*blue*/
.bd_k1{ padding: 0 0 0.5em; border-bottom: solid 1px #000;}/*black*/
.bd_k2{ padding: 0 0 0.5em; border-bottom: solid 2px #000;}/*black*/

.navy{ color: #003d8b;}
.blue{ color: #1d6fb4;}
.red{ color: #e17400;}
.gray{ color: #666;}
.green{ color: #7d9e1f;}
.beige{ color: #c49816;}
.brown{ color: #6e520f;}
.bg_ocher { background: #e1dabe !important;}
.bg_ivory{ background: #f7f5eb !important;}
.bg_beige{ background: #fbf8ee;}
.bg_blue{ background: #e7f2f6;}
.bg_green{ background: #e0f8d3;}
.bg_yellow{ background: #f9f3d0;}
.bg_orange{ background: #f8e8cf;}
.bg_pink{ background: #fadbdb;}

.mg0{ margin: 0 !important;}
.mg05t{ margin-top: 5px;}
.mg05l{ margin-left: 5px;}
.mg05r{ margin-right: 5px;}
.mg05b{ margin-bottom: 5px !important;}
.mg05tb{ margin: 5px 0;}
.mg10t{ margin-top: 10px;}
.mg10l{ margin-left: 10px;}
.mg10r{ margin-right: 10px;}
.mg10b{ margin-bottom: 10px !important;}
.mg10tb{ margin: 10px 0;}
.mg10lr{ margin: 0 10px;}
.mg15{ margin: 15px;}
.mg15t{ margin-top: 15px;}
.mg15l{ margin-left: 15px;}
.mg15r{ margin-right: 15px;}
.mg15b{ margin-bottom: 15px;}
.mg15tb{ margin: 15px 0;}
.mg15lr{ margin: 0 15px;}
.mg20l{ margin-left: 20px;}
.mg20r{ margin-right: 20px;}
.mg20b{ margin-bottom: 20px;}
.mg20tb{ margin: 20px 0;}
.mg20lr{ margin: 0 20px;}
.mg30l{ margin-left: 30px;}
.mg30r{ margin-right: 30px;}
.mg30b{ margin-bottom: 30px;}
.mg30tb{ margin: 30px 0;}
.mg30lr{ margin: 0 30px;}
.mg70t{ margin-top: 70px;}

img{
	border: none;
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
}
.img_r{ margin: 0 0 20px 20px; float: right;}
.img_l{ margin: 0 20px 20px 0; float: left;}

.c{ text-align: center;}
.l{ text-align: left;}
.r{ text-align: right;}

.clr{ clear: both;}
.clr_l{ clear: left;}
.clr_r{ clear: right;}

.f_l{ float: left;}
.f_r{ float: right;}

.w130{ width: 130px;}
.w260{ width: 260px; line-height: 1.7; font-size: 95%;}
.w330{ width: 330px;}
.w390{ width: 390px;}
.w450{ width: 450px;}
.w480{ width: 480px;}
.w550{ width: 550px;}

.w50p{ width: 48%;}
.w60p{ width: 60%;}
.w80p{ width: 80%;}

hr{
	margin: 0;
	padding: 1.5em;
	clear: both;
	border: none;
	height: 0;
}

/* LAYOUT --------------------------------------------------------------------------------------------*/

#container{ background: url(common/bg_container.gif) no-repeat 50% 340px;}

#wrap{
	margin: 0 auto;
	padding: 20px 50px 0;
	width: 860px;
	min-height: 400px;
	text-align: left;
}
header{
	margin: 0 auto;
	padding: 0;
	position: relative;
	width: 960px;
	height: 182px;
	overflow: hidden;
}
#center{
	padding: 0 0 10px;
}
footer{
	clear: both;
	min-width: 960px;
	text-align: left;
	font-size: 12px;
}

/* TITLES --------------------------------------------------------------------------------------------*/

h1{
	margin: 0 auto;
	padding: 55px 50px;
	width: 860px;
	color: #444;
	line-height: 47px;
	text-align: left;
	font-size: 47px;
	font-weight: normal;
}
@media only screen and (min-width: 768px){
	h1{ background: url(common/h1_aboutus.jpg) no-repeat 0 0;}
	#sozoku h1{ background: url(common/h1_sozoku.jpg) no-repeat 0 0;}
	#kazoku h1{ background: url(common/h1_kazoku.jpg) no-repeat 0 0;}
	#yuigon h1{ background: url(common/h1_yuigon.jpg) no-repeat 0 0;}
	#kaisha h1{ background: url(common/h1_kaisha.jpg) no-repeat 0 0;}
}
h2{
	margin: 0 0 1.5em;
	padding: 0 0 17px;
	position: relative;
	background: url(common/h2.png) no-repeat 50% 100%;
	text-align: center;
	font-size: 22px;
	font-weight: normal;
}
h2 a{
	color: #222;
}
h3{
	margin: 0 0 1em;
	position: relative;
	background: url(common/h3.png) no-repeat 0 center;
	line-height: 1.5;
	font-size: 108%;
}
h3 span{
	padding: 0 0 0 25px;
	border-bottom: solid 1px #bc9112;
}
h4{
	margin: 0 0 0.5em;
	padding: 0 0 0 0.7em;
	border-left: solid 3px #003d8b;
	line-height: 1.5;
	font-size: 100%;
	text-align: left;
}
h4 span{ font-weight: normal;}
h5{
	margin: 0 0 .25em;
	padding: 0 0 0 18px;
	background: url(common/ic_2.png)  no-repeat 2px .35em;
	font-size: 100%;
	font-weight: normal;
}
.sml1 h4{ padding: 2px 0 0 17px; background-position: 0 4px;}

/* Header --------------------------------------------------------------------------------------------*/

#header .tel_no{
	position: absolute;
	top: 25px;
	left: 420px;
	width: 380px;
	height: 30px;
}
#header .tel_no .f_l{
	margin: 4px 5px 0 0;
	line-height: 1.4;
	font-size: 10.5px;
}
#header .tel_no .r{ text-align: right;}
#header .tel_no .no{
	padding: 0 5px 0 25px;
	width: 200px;
	float: left;
	color: #1d6fb4;
	background: url(common/ic_tel.png) no-repeat 0 center;
	line-height: 1.0;
	letter-spacing: -0.01em;
	text-align: left;
	font-size: 34px;
	font-family: "Palatino Linotype", "Times New Roman", "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3";
}

/* Index --------------------------------------------------------------------------------------------*/

#index #container{ background: url(common/bg_container_index.jpg) no-repeat 50% 182px;}

#index h1{
	margin: 50px auto;
	padding: 0;
	width: 960px;
	height: 150px;
	overflow: hidden;
	background: url(common/mainimg.png) no-repeat 0 0;
}
#index h1 span{ display: none;}

#index #mainimg_sph{ display: none;}

#index #wrap{ padding: 30px 50px 0;}

#index article{ margin: 0 20px 20px;}
#index #introduction{ padding: 0;}
#index #introduction article{
	margin: 0 20px;
	padding: 15px 220px 5px 170px;
	background: url(common/index_1.jpg) no-repeat 0 0;
	min-height: 183px;
	font-size: 105%;
}
#index_faq .clrfx{ padding: 0 0 20px;}
#index_faq h3{
	margin: 0;
	padding: 0 2px 4px 27px;
	background: url(common/ic_1.png) no-repeat 0 2px;
}
#index_faq h3 span{ border: none;}
#index_faq h3.sml1{ font-size: 99%;}
#index_faq img{ margin: 5px 0 0;}
#index_faq .arrow{
	padding: 40px 0 0;
	background: url(common/flow_1.png) no-repeat 50% 0;
	line-height: 1.5;
}
#index_faq .icons,
#index_faq .no_icons{
	margin: 0 0 10px;
	padding: 0 45px;
}
#index_faq .icons{ background: url(common/ic_plus.png) no-repeat 50% 100%;}
#index_faq .w390 .f_l{ color: #009fd3;}
#index_faq .w390 .f_r{ color: #df8401;}

#index_menu img{ margin: 0 0 5px;}

/* Articles --------------------------------------------------------------------------------------------*/

section{ padding: 0 0 30px; clear: both;}

article{ margin: 0 25px;}
article p{ margin: 0 0 1em;}
article p,
.f_l, .f_r{
	text-align: justify;
	text-justify: inter-ideograph;
}

/* div */

.flow_arrow_t{
	padding: 45px 0 0;
	background: url(common/flow_1.png) no-repeat 50% 0;
}
.flow_arrow_b{
	padding: 0 0 45px;
	background: url(common/flow_1.png) no-repeat 50% 99%;
}

/* column */

.column1, .column2, .column3{ margin: 0 0 20px; padding: 1em 1.5em;}
.column1{ border: solid 1px #003d8b;}
.column2{ border: solid 1px #bc9112;}
.column1 h4, .column2 h4{ padding: 0 0 0 15px; border: none;}
.column1 h4{ background: url(common/ic_5.png)  no-repeat 0 center;}
.column2 h4{ background: url(common/ic_3.png)  no-repeat 0 center;}
.column1 .dl2 dl{ border-color: #003d8b;}
.column3{
	padding: 1em;
	border: solid 3px #ebe5ce;
	background: #fbf9f5;
}

/* LIST *********/

/* ul, ol */

article ul{ margin: 0 0 1em 5px; padding: 0 0 0 1.5em;}
article ol{ margin: 0 0 1em 5px; padding: 0 0 0 2em;}
article ul ul{ margin: 0 0 1em 5px; padding: 0 0 0 1em;}

article ul.ul_inline{
	margin: 0;
	padding: 0;
	list-style: none;
}
article ul.ul_inline li{
	margin: 0 10px 0 0;
	display: inline;
}

/* list_Check Icon */

article ul.ic_check{
	margin: 0;
	padding: 0;
	list-style: none;
}
article ul.ic_check li{
	padding: 0 0 0 20px;
	background: url(common/ic_check.png) no-repeat 0 center;
}

/* dl */

dl.dl1 dt{
	padding: 0 0 0 20px;
	background: url(common/ic_2.png)  no-repeat 0 6px;
	font-weight: bold;
}
dl.dl1 dd{
	margin: 0 0 0.45em;
	padding: 0 2px 0.45em 20px;
	border-bottom: dotted 1px #ddcf99;
}

.dl2{ margin: 0 0 30px;}
.dl2 dl{ margin: .5em 0; padding: 0 0 .5em; border-bottom: dotted 1px #ddcf99;}
.dl2 dl dt{ margin: 0; float: left; width: 16%;}
.dl2 dl dd{ margin: 0; float: right; width: 83%;}
.dl2 dl dd ul, .dl2 dl dd ol{ margin: 0;}
.f_l .dl2 dl, .f_r .dl2 dl{ margin: .3em 0; padding: 0 0 .3em;}
.f_l .dl2 dl dt, .f_r .dl2 dl dt{ width: 25%;}
.f_l .dl2 dl dd, .f_r .dl2 dl dd{ width: 74%;}

.dl1 .dl2 dt{ padding: 0; background: none; font-weight: normal;}
.dl1 .dl2 dd{ margin-left: 0;}

.dl3{ margin: 0 0 30px; border-top: solid 1px #ddcf99;}
.dl3 dl{ margin: 0; padding: 0; border-bottom: solid 1px #ddcf99;}
.dl3 dl dt{ margin: 0; padding: 0.5em 2%; float: left; width: 45%; background: #f3efe0;}
.dl3 dl dd{ margin: 0; padding: 0.5em 2%; float: right; width: 45%;}


.dl_ic dl{
	padding: 0 2px 0.4em 18px;
	border-bottom: 1px dotted #ccc;
	background: url(common/ic_2.png)  no-repeat 2px 12px;
}
.dl_ic dl dt{ margin: 0.4em 0 0; float: left; width: 20%;}
.dl_ic dl dd{ margin: 0.4em 0 0; float: right; width: 79%;}


/* Tables **********/

table caption{ padding: 0 0 0.5em;}
table, tr, th, td{ border-collapse: collapse; font-size: 1;}
table{ margin: 0 0 20px; width: 100%;}
th{
	background: #f3efe0;
	font-weight: normal;
}
th, td{
	padding: 0.2em 0.5em;
	border: 1px solid #ddcf99;
	line-height: 160%;
}
.tbl_str1{ border: 3px solid #ddcf99;}
.tbl_1{ line-height: 150%; font-size: 85%;}
.tbl_1 th{ white-space: nowrap; font-weight: normal;}
.tbl_1 th, .tbl_1 td{ padding: 0.25em 0.3em;}
.tbl_2 th{ background: #e1dabe;}

section table ul, section table ol{ margin: 0;}


/* Form ***********/

#form_sakaioffice .Dlist{ margin: 0 20px 30px;}

#form_sakaioffice .dl2 dl dt{ width: 25%;}
#form_sakaioffice .dl2 dl dd{ width: 74%;}

#form_sakaioffice .btn input:hover{ cursor: pointer;}

input, textarea{
	font-size: 95%;
	font-family: Meiryo, Verdana, "メイリオ", "ＭＳ Ｐゴシック", Hiragino Kaku Gothic Pro, Osaka;
}
/*input[type="text"],input[type="email"]{ max-width: 70%;}*/
input[type="text"],input[type="email"], textarea{
	margin: 1px 0;
	padding: 0.1em 3px;
	vertical-align:middle;
	border:1px solid #ccc;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
}
input[type="submit"],input[type="reset"],input[type="button"]{
	padding:3px 15px;
	color: #fff;
	background: #003d8b;
	border:0;
	border-radius:2px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	line-height:1.5;
}
input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover{
	background: #1d6fb4;
	cursor: pointer;
}
#mailfrom_hidden_object {
	width: 1px;
	height: 1px;
	overflow: hidden;
}
#form_sakaioffice ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
#form_sakaioffice li{
	margin: 0 10px 0 0;
	padding: 0;
	display: inline;
	float: left;
	width: 5em;
}
#form_sakaioffice label:hover{ background-color: #f3efe0;}

#form_sakaioffice .mfp_buttons input{
	margin: 5px;
	padding: 0.2em;
	width: 100px;
	overflow: hidden;
	cursor: pointer;
}
#form_sakaioffice .mfp_err{ color: #e17400; font-size: 90%;}
div#confirmWindow {
	filter: alpha(opacity=30);
	-moz-opacity: 0.3;
	-khtml-opacity: 0.3;
	opacity: 0.3;
	width: 100%;
	height: 100%;
	margin: 0;
	overflow: hidden;
	z-index: 1;
	position: fixed!important;
	position/**/:  absolute;
	top: 0;
	left: 0;
	visibility: hidden;
	background-color: #231815;
	text-align: center;
	_top: expression(
		document.documentElement && document.documentElement.scrollTop  || 
		document.body && body.scrollTop  || 0
		+ 0 + 'px'
	);
}
div#confirmBody {
	width: 1px;
	visibility: hidden;
	position: absolute;
	z-index: 10;
	text-align: center;
	margin: 0 auto;
}
div#confirmBody div.mfp_title {
	color: #fff;
	margin: 0 auto 0 auto;
	width: 294px;
	height: 33px;
	padding-top: 10px;
}
div#twex {
	margin: 0;
	overflow: hidden;
	z-index: 100;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	text-align: center;
	background-color: #231815;
	filter: alpha(opacity=60);
	-moz-opacity: 0.60;
	-khtml-opacity: 0.60;
	opacity: 0.60;
}
img#loading_proccess_image {
	position: absolute;
	z-index: 1000;
}

/* Sozoku ||||||||||||||||||||||||*/

/* Sozoku_top ***********/

#sozoku_introduction h2{
	margin: 0 0 0.5em;
	text-align: left;
	font-size: 20px;
}
/*#sozoku_introduction .f_r p{ font-size: 110%;}*/

/* Flow ***********/

#sozoku_flow article{
	margin: 0 25px 5px;
	padding: 0 0 40px;
	background: url(common/flow_2.png) no-repeat 50% 100%;
	font-size: 110%;
}
#sozoku_flow article:last-child{
	padding: 0;
	background: none;
}
#sozoku_flow article .clrfx{
	padding: 0 0 15px;
	border-bottom: solid 1px #ddcf99;
}
#sozoku_flow article span{ font-weight: bold; font-size: 110%;}
#sozoku_flow article img{ margin: 0 15px 0 0; float: left;}
#sozoku_flow article .f_l{ width: 260px;}
#sozoku_flow article .f_r{ width: 460px;}

/* sozokunin ***********/

#sozokunin_3 .sozokunin_box{
	margin: 0 0 30px;
	background: url(common/sozokunin_bg.png);
}
#sozokunin_3 .sozokunin_top{ background: url(common/sozokunin_bg_t.png) no-repeat 0 0;}
#sozokunin_3 .sozokunin_btm{
	padding: 15px 25px;
	background: url(common/sozokunin_bg_b.png) no-repeat 0 100%;
}
#sozokunin_3 .sozokunin_btm .f_l{ padding: 0 0 20px; width: 200px;}
#sozokunin_3 .sozokunin_btm .f_r{ padding: 20px 0 0; width: 505px;}
#sozokunin_3 table{ margin: 0 0 10px;}

/* kazoku ||||||||||||||||||||||||*/

#kazoku_1 .column2 ul{ margin-bottom: 0;}

/* Fee ||||||||||||||||||||||||*/

#fee article{ margin-bottom: 40px;}
#fee article.column{
	margin: 0 0 40px;
	padding: 25px;
	box-sizing: border-box;
	border: double 5px #ede8d1;
}

#fee_introduction .dl2 dl{
	margin: .3em 0 .3em 10px;
	padding: .15em 0 .15em 15px;
	background: url(common/arrow_y_7.gif) no-repeat 0 50%;
}
#fee_introduction .dl2 dl dt{ width: 69%;}
#fee_introduction .dl2 dl dd{ width: 30%; text-align: right;}

#fee_introduction ul{
	margin: 0 0 15px 10px;
	padding: 0;
	list-style: none;
}
#fee_introduction li{
	padding: 0.3em 0 0.3em 15px;
	border-bottom: dotted 1px #ddcf99;
	background: url(common/arrow_y_7.gif) no-repeat 0 50%;
}
#fee_introduction table{ margin: 0 0 5px;}
#fee_introduction th{ text-align: left;}
#fee_introduction tr:first-child th{ text-align: center;}
#fee_introduction th.bg_ivory{ width: 50%; text-indent: 2em;}
#fee_introduction td{ text-align: center;}
#fee_introduction table.fees td{ width: 25%; text-align: right;}

/* Aboutus ||||||||||||||||||||||||*/

#access iframe{
	border: none;
	width: 100%;
	height: 400px;
	border: solid 1px #ddcf99;
}

/* Footer --------------------------------------------------------------------------------------------*/

.footer_inner{
	margin: 0 auto;
	width: 860px;
}
#footer_top{
	padding: 10px 0;
	background: #e1dabe;
}
/* Footer Navigation -> navigation.css *****/

/* #footer_btm ***********/

#footer_btm{
	padding: 0 0 20px;
	background: #f3efe0;
}
#f_content{
	line-height: 1.7;
	float: left;
	width: 600px;
}
#f_content a{ color: #222;}
#f_content p{ margin: 0.5em 0 0 1em;}

#footer_btm .tel_no{
	margin: 0 0 0.2em;
	float: right;
	width: 250px;
	line-height: 1.4;
	font-size: 95%;
}
#footer_btm .tel_no p{ margin: 0 0 0.2em;}
#footer_btm .tel_no strong{
	padding: 0 0 0 25px;
	color: #003d8b;
	background: url(common/ic_tel.png) no-repeat 0 center;
	line-height: 1.0;
	letter-spacing: -0.01em;
	font-size: 36px;
	font-family: "Palatino Linotype", "Times New Roman", "ＭＳ Ｐ明朝", "MS PMincho", "Hiragino Mincho Pro", "ヒラギノ明朝 Pro W3";
	font-weight: normal;
}

#footer_btm .footer_inner{
	padding: 10px 0 0;
	background: url(common/arrow_y_6.gif) no-repeat 40px 0;
}

#copy{
	padding: 0.5em 0;
	clear: both;
	border-top: solid 1px #ddcf99;
	background: #f3efe0;
}

/* Print --------------------------------------------------------------------------------------------*/

@media print {
body{ background: none;}
#container{ background: none;}
}

/* UTILITY --------------------------------------------------------------------------------------------*/

/* --- GET HIGHT --- */

article:after,
section:after,
.clrfx:after,
.Dlist dl:after,
.column1:after, .column2:after, .column3:after{
    content: " ";
    display: table;
	clear: both;
}
article,
section,
.clrfx,
.Dlist dl,
.column1, .column2, .column3{ *zoom: 1;}