@charset "utf-8";
/*
Theme Name: tpl_002
Theme URI: http://ecm.jp.net
Description: tpl_001
Version: 1.0
Author URI: http://ecm.jp.net
Tags: simple1

*//* =Reset default browser CSS.
Based on work by Eric Meyer:http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{border:0;font-family:;font-size:100%;font-style:;font-weight:400;margin:0;outline:0;padding:0;vertical-align:baseline;}
:focus{outline:0;  height: 100%; min-height: 100%;}

html, body {height: 100%; min-height: 100%;}

ol, ul{list-style:none;}
table{border-collapse:separate;border-spacing:0;}
caption, th, td{font-weight:normal;text-align:left;}
blockquote:before, blockquote:after,q:before, q:after{content:"";}
blockquote, q{quotes:"" "";}
a img{border:0;}
figure{margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
/* -------------------------------------------------------------- */

body{
color: #565454;
font-size:small;
font-family:verdana,"ヒラギノ丸ゴ ProN W4","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
line-height:1.5;

-webkit-text-size-adjust:100%;
  height: 100%; min-height: 100%;
overflow-x: hidden;
    margin:0;
  height: auto; /* 要素を超えた分の背景が伸びないブラウザ用 */
}



a:hover img {
 opacity: 0.5;
}
 
a img {
 transition: opacity 0.3s ease-out;
}


.inner{
margin:0 auto;
width:980px;
clear: both;
}



.right_img{
float: left;
width: 200px;
padding-left: 10px;
}


.header{
    width: 100%;
    clear: both;
    background-color: #fff;
    height: 90px;
    border-top: 4px #FBBB06 solid;
    border-bottom: 4px #727763 solid;
}

.logo_l{float: left; width: 460px;}
.logo_r{float: left; width: 530px;}


.main_nav{
    width: 100%;
    height: 48px;
    background: rgba(247, 184, 0, 0.96) none repeat scroll 0% 0%;
    margin:0 auto;
}


.nav_inner{
    width: 980px;
    height: 48px;
    background-color: #ccc;
    margin:0 auto;
}

.menu li{
    font-size: 14px;
    display: block;
    float: left;
    width: 157px;
    margin: 0 0px 0 3px;
    padding: 0;
    border-right: 2px #999 solid;
    border-left: 1px #ccc solid;
    border-bottom: 1px #ccc solid;
 }




.menu li a{
    display: block;
    padding: 12px 0px 6px;
    background: #fff;
    color: #565454;
    text-align: center;
    text-decoration: none;
}


.tmidashi_l h5 {
    margin: -8px -16px -5px;
    font-size: 22px;
    background: url("../img/m1.jpg") no-repeat 0.5em;
    text-indent: 52px;
    padding: 4px;
}



.tmidashi_l p{
    padding: 4px;
    font-size: 16px;
}



.menu li a{
 white-space: nowrap;
}

.menu a.on{background-color:#FF9900; color: #FFF;}
.menu a:hover{background-color:#FF9900; color:#FFF;}



.menu a strong{
display: block;
margin: -8px 0px -5px;
}

.menu a span {
    color: #708C0C;
    font-size: 10px;
}


.content{
    background-color: #fff;
    margin:10px auto;
    width:980px;
    min-height: 100%;
    height: auto; /* 要素を超えた分の背景が伸びないブラウザ用 */
}


.main{
    float: left;
width: 736px;
border: 10px #ccc solid;
padding: 20px 10px 20px 10px;
}

.main h1{
font-size: 20px;
font-weight: 500;
}


.main h2{
font-size: 22px;
font-weight: 500;
color: #322e2e;
    margin: 0px 0 10px 10px;
}


.main h3{
font-size: 22px;
font-weight: 500;
    margin: 0px 0 0px 10px;
}


.main p{
    width: 650px;
    margin: 0px 0 0px 20px;
    padding: 6px 0px 6px 0px;
    font-size: 14px;
}


.c_m{
font-size: 12px;
}


.hosoku{
    width: 650px;
    margin: 0px 0 0px 20px;
    padding: 6px 0px 6px 0px;
    font-size: 12px;
}

.sab_info{
background: #FFF0E8;
border: solid 1px #E1E1E1;
margin: 0px 0 20px 20px;
padding: 19px 19px 19px 30px;
line-height: 1.6;
width: 406px;
float: left;
}




.marugoto {
    border: solid 1px #E1E1E1;
    margin: 0px 0 20px 0;
    padding: 26px 5px 4px 9px;
    display: table;
}

.marugoto tbody {
    display: table-row-group;
}


.marugoto tr {
    display: table-row;
}


.marugoto th {
    border-top: solid 1px #E1E1E1;
    border-right: solid 1px #E1E1E1;
    border-bottom: solid 1px #E1E1E1;
    border-left: solid 1px #E1E1E1;
    background: #F0F9FF;
    text-align: left;
    vertical-align: top;
    font-weight: normal;
    line-height: 1.6;
    width: 210px;
    padding: 6px 0 6px 0px;
    font-size: 16px;
    text-align: center;
}



.marugoto td {
    border-right: solid 1px #E1E1E1;
    border-bottom: solid 1px #E1E1E1;
    text-align: left;
    vertical-align: top;
    line-height: 1.6;
    padding: 6px 5px 6px 9px;
    width: 505px;
    font-size: 16px;
    text-align: center;
}




.marugoto1 {
    margin: 30px 0 0px 0;
    display: table;
    font-size: 20px;
    color: #B77D07;
}

.marugoto1 tbody {
    display: table-row-group;
}


.marugoto1 tr {
    display: table-row;
}


.marugoto1 td {
    text-align: left;
    padding: 0px0px 0px 0px;
    width: 440px;
    text-align: center;
}


.marugoto1 th {
    text-align: left;
    vertical-align: top;
    line-height: 1.6;
    padding: 26px 5px 4px 9px;
    width: 120px;
    font-size: 14px;
}





.marugoto2 {
    border: solid 1px #E1E1E1;
    margin: 0px 0 20px 20px;
    padding: 26px 15px 4px 10px;
    display: table;
}

.marugoto2 tbody {
    display: table-row-group;
}


.marugoto2 tr {
    display: table-row;
}


.marugoto2 th {
    border-top: solid 1px #E1E1E1;
    border-right: solid 1px #E1E1E1;
    border-bottom: solid 1px #E1E1E1;
    border-left: solid 1px #E1E1E1;
    background: #F0F9FF;
    text-align: left;
    vertical-align: top;
    font-weight: normal;
    line-height: 1.6;
    width: 210px;
    padding: 6px 0 6px 0px;
    font-size: 16px;
    text-align: center;
}



.marugoto2 td {
    border-right: solid 1px #E1E1E1;
    border-bottom: solid 1px #E1E1E1;
    text-align: left;
    vertical-align: top;
    line-height: 1.6;
    padding: 6px 5px 6px 9px;
    width: 430px;
    font-size: 16px;
    text-align: left;
}

dt{
font-size: 16px;
padding: 0px 0px 5px;
font-weight: 600;
}



.submenu{
    float: left;
    width: 180px;
    margin: 0 16px 0px 0px;
}



.submenu_l li{
    width: 161px;
    border: 10px #efece1 solid;
    margin: 0 16px 0px 0px;

}

.submenu_l a{
color: #006BC4;
width: 121px;
height: 20px;
text-decoration: none;
background-color: #FFD14E;;
display: block;
padding: 10px 20px 10px 20px;
}

.submenu_l a:hover{
color: #333;
width: 121px;
height: 20px;
text-decoration: none;
background-color: #F9E097;;
display: block;
padding: 10px 20px 10px 20px;
}


.t_menu li{
    float: left; 

}

.t_menu2 ul{
    clear: both;
}


.t_menu2 li{
    float: left; 

}


.tcm1{
    float: left; 
    clear: both;
}


.tcm2{
    float: left; 
}


.tmidashi_l{
    float: left; 
    width:680px;
    padding:5px 5px 5px 15px;
}

.tmidashi_r{
    float: left; 
    width:200px;
    padding:5px;
}

.cl{
    clear: both;
}


.whatsnew{
    float: left; 
    width:430px;
    height: 420px;
    border: 14px #CFDCCC solid;
    margin: 0 16px 16px 24px;
}

.whatsnew h3{
    font-size: 20px;
}


.zirei{
    float: left; 
    width:430px;
    height: 420px;
    border: 14px #EAE0AF solid;
}

.zirei h3{
    font-size: 20px;
}





/* フッター*/


.footer {
    clear: both;
    overflow: hidden;
    padding: 10px 10px 20px;
    background: rgba(247, 184, 0, 0.96) none repeat scroll 0% 0%;
}
* html #footer{height:1%;}

.footer .grid{
    float:left;
    padding:10px 0 5px;
    margin:0;
    background:transparent;
}

.footer #info .logo, #footer #info .info{float:none;}


ul.foot_nav{
    width: 600px;
    padding: 10px 0px;
    margin: 0px auto;
}
ul.foot_nav ul{display:none;}

ul.foot_nav li{
    float:left;
    margin-bottom:10px;
    padding:0 10px 0 8px;
    border-right:1px solid #666;
}

.footer a{color:#333;}
.footer a:hover{color:#888;}




.copyright{
    clear:both;
    padding:5px;
    text-align:center;
    font-style:normal;
    font-size:12px;
    color:#fff;
    background:#333;
}


#m_page-top {
clear: both;
text-align: right;
padding: 70px 10px 30px 10px;
}


#page-top {
clear: both;
text-align: center;
padding: 40px 10px 40px 10px;
background: #545252;
width: 60px;
position: fixed;
bottom: 10px;
right: 10px;
}


#page-top a{
color: #fff;
text-decoration: none;
}


#page-top a:hover{
color: #ccc;
text-decoration: none;
}




/* menu
--------------------------------------------------------------------*/
#c_menu1 {
	margin:0 0 30px 0;
}
#c_menu1 ul {
	overflow:hidden;
	zoom:1;
}
#c_menu1 ul li {
	float:left;
	margin-top:2px;
	margin-right: 2px;
}
#vc_menu1 ul li.right {
	margin-right:0;
}



/* menu
--------------------------------------------------------------------*/
#c_menu2 {
	margin:0 0 30px 0;
}
#c_menu2 ul {
	overflow:hidden;
	zoom:1;
}
#c_menu2 ul li {
	float:left;
	margin-top:2px;
	margin-right:2px;
}
#vc_menu2 ul li.right {
	margin-right:0;
}






/* bus
--------------------------------------------------------------------*/

/*div*/
.bus div.bus div {
	float:left;
	width:420px;
	margin-bottom:30px;
}
.bus div.bus div p {
	font-size:1.2em;
	line-height:1.6;
	margin:10px 0 0 0;
}
.bus div.bus div table {
	border-top:solid 1px #E1E1E1;
	border-left:solid 1px #E1E1E1;
	margin-top:20px;
}
.bus div.bus div table tr th {
	border-right:solid 1px #E1E1E1;
	border-bottom:solid 1px #E1E1E1;
	background:#F0F9FF;
	text-align:left;
	vertical-align:top;
	padding:6px 0 6px 9px;
	width:149px;
	font-size:1.2em;
	line-height:1.6;
	font-weight:normal;
}
.bus div.bus div table tr td {
	border-right:solid 1px #E1E1E1;
	border-bottom:solid 1px #E1E1E1;
	text-align:left;
	vertical-align:top;
	padding:6px 0 6px 9px;
	width:250px;
	font-size:1.2em;
	line-height:1.6;
}
div#bus div.bus div dl dt.bus_dt {
	font-size:1.4em;
	line-height:1.6;
	font-weight:bold;
	margin:20px 0 10px 0;
}
div#bus div.bus div dl dd.bus_dd {
	background:#FFF0E8;
	border:solid 1px #E1E1E1;
	padding:19px 19px 19px 19px;
	font-size:1.2em;
	line-height:1.6;
}
div#bus div.bus div dl dd.bus_dd dl dt {
	font-size:1em;
	font-weight:bold;
}
div#bus div.bus div dl dd.bus_dd dl dd {
	font-size:1em;
}


/*bus01*/
div#bus div.bus01 div dl dt {
	font-size:1.4em;
	line-height:1.6;
	font-weight:bold;
	margin:20px 0 10px 0;
}
div#bus div.bus01 div dl dd {
	background:#FFF0E8;
	border:solid 1px #E1E1E1;
	padding:19px 19px 19px 19px;
	font-size:1.2em;
	line-height:1.6;
}


/*img*/
div#bus div.bus ul.c_img {
	float:right;
	width:160px;
	margin-bottom:30px;
}
div#bus div.bus ul.c_img li {
	margin-top:10px;
}

div#content div#bus div.bus p.pagetop {
	clear:both;
	margin:0 0 30px 0;
}


/* bus06
--------------------------------------------------------------------*/
.bus .bus06 h3 {
	margin:0 0 10px 0;
}
.bus .bus06 {
	font-size:1.2em;
	line-height:1.6;
}
/*table*/
.bus .bus06 table {
	border-top:solid 1px #E1E1E1;
	border-left:solid 1px #E1E1E1;
}
.bus .bus06 table tr th {
	border-right:solid 1px #E1E1E1;
	border-bottom:solid 1px #E1E1E1;
	background:#F0F9FF;
	text-align:left;
	vertical-align:top;
	padding:6px 0 6px 9px;
	font-size:1.2em;
	line-height:1.6;
	font-weight:normal;
}
.bus div.bus06 table tr td {
	border-right:solid 1px #E1E1E1;
	border-bottom:solid 1px #E1E1E1;
	text-align:left;
	vertical-align:top;
	padding:6px 0 6px 9px;
	font-size:1.2em;
	line-height:1.6;
}
/*table01*/
.bus .bus06 table.table01 {
	margin:20px 0 20px 0;
}
.bus .bus06 table.table01 tr th {
	width:159px;
}
.bus .bus06 table.table01 tr td {
	width:420px;
}
/*table02*/
.bus .bus06 table.table02 {
	margin:20px 0 30px 0;
}
.bus .bus06 table.table02 th {
	width:109px;
}
.bus .bus06 table.table02 th.table02_th {
	width:230px;
}
/*pagetop*/
.bus .bus06 p.pagetop {
	margin:0 0 30px 0;
}

/* bus07
--------------------------------------------------------------------*/
.bus .bus07 h3 {
	margin:0 0 10px 0;
}
.bus .bus07 p {
	font-size:1.2em;
	line-height:1.6;
}
.bus .bus07 dl.bus07 dt {
	font-size:1.4em;
	line-height:1.6;
	font-weight:bold;
	margin:20px 0 10px 0;
}
.bus .bus07 dl.bus07 dd {
	background:#FFF0E8;
	border:solid 1px #E1E1E1;
	padding:19px 19px 19px 19px;
	font-size:1.2em;
	line-height:1.6;
}
.bus .bus07 div {
	overflow:hidden;
	zoom:1;
	margin:20px 0 30px 0;
}
.bus .bus07 div dl {
	float:left;
	margin-right:10px;
}
.bus .bus07 dl dt {
	font-size:1.2em;
	line-height:1.6;
}
.bus .bus07 dl dd {
	margin:0 0 10px 0;
}
.bus .bus07 dl dd ul {
	overflow:hidden;
	zoom:1;
}
.bus .bus07 dl dd ul li {
	float:left;
	margin-right:5px;
}
.bus .bus07 dl dd ul li.last {
	margin-right:0;
}
.bus .bus07 p.pagetop {
	margin:0 0 30px 0;
}

/* Before & After 比較用のスタイル */
.comparison-container {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 20px;
    margin: 20px 0;
}

.comparison-item {
    flex: 1;
    max-width: 48%;
    border: 1px solid #E1E1E1;
    padding: 15px;
    background: #fff;
}

.comparison-item h4 {
    font-size: 18px;
    margin-bottom: 10px;
    text-align: center;
    color: #565454;
}

.comparison-item img {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.comparison-item p {
    text-align: center;
    width: 100% !important; /* 既存のスタイルをオーバーライド */
    margin: 0 !important; /* 既存のスタイルをオーバーライド */
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .comparison-container {
        flex-direction: column;
    }
    
    .comparison-item {
        max-width: 100%;
    }
}




/* normal block
--------------------------------------------------------------------*/

p {
	text-align: justify;
	text-justify: distribute;
}

/* anchor
--------------------------------------------------------------------*/

a:link {

	text-decoration: none;
}

a:visited {

	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

a:active {
}

/* table
--------------------------------------------------------------------*/

table {
	border-collapse: collapse;
	border-spacing: 0;
}









/*TOPページ 中央ブログ更新部--*/

#mycustomscroll{
clear:both; 
}

#toponecolum　dl{
height: 100%;
min-height: 100%;
padding: 3px 0px 3px 0px;
clear:both; 
}

#toponecolum　dd{
height: 100%;
min-height: 100%;
padding: 3px 0px 3px 0px;
}

.time{
padding: 4px 0px 4px 6px;
font-size: 14px;
float: left;
width: 100px;
 word-wrap:break-all;
}

.now{
padding: 4px 0px 4px 0px;
font-size: 14px;
float: left;
width: 300px;
 word-wrap:break-all;
}






/*--- トップページインライン部　----------------------------------------------------*/

#mycustomscroll {
/* Typical fixed height and fixed width example */
height:380px;
width: 430px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/

margin:0px 0px 0px 10px;
padding: 0;
clear:both;
font-size:14px; 

}

#mycustomscroll dd {
height:20px;
margin:10px 0px 0px 0px;
}

#mycustomscroll a {
color:#666;
text-decoration:none;
}


#mycustomscroll a:hover {
color:#6C9;
}


#mycustomscroll span {
padding:0px 6px 0px 0px;
}









#onecolum{
width:760px;
    height: auto !important;
    height: 100%;
    min-height: 100%;
margin:0 auto;
padding:0px;
clear:both;
}

.cyorsei {padding:0px 0px 20px 0px;}
.banner {height:100px; margin:30px 100px; padding:0px; z-index: 999;}


#onecolum h2{
padding:20px 0px 14px 0px;
font-size: 12px;
}