/* Getting the new tags to behave */
/*article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {
	display: block;
}*/
mark, rp, rt, ruby, summary, time {
	display: inline;
}
figure  img { width: 100%; }

/* Global properties ======================================================== */
html {
	width: 100%;
}
body {
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic",  Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 1.6em;
	color: #404040;
	text-align:justify;
	text-justify: inter-ideograph;
	text-align-last:left;
	background: #222;
	background: url(../images/row-bot-bg.jpg) center bottom repeat-x;
}
.ic, .ic a {
	border: 0;
	float: right;
	background: #fff;
	color: #f00;
	width: 50%;
	line-height: 10px;
	font-size: 10px;
	margin: -220% 0 0 0;
	overflow: hidden;
	padding: 0;
}
.main {
	padding: 0;
	margin: 0 auto;
	font-size: 1em;
	line-height: 1.6em;
	position:relative;
}
a {
	color: #336699;
	outline: none;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a.bn_img img:hover {
	opacity: 0.6;
	transition: all .3s ease-in-out;
}
.col-1, .col-2 {
	float: left;
}
.wrapper {
	width: 100%;
	overflow: hidden;
}
.bg {
	width: 100%;
	background-color:#fefefe;
}
.extra-wrap {
	overflow: hidden;
}
.extra {
	padding: 10px;
}
.heading {
	margin: 10px;
	}
.h-base {
	margin: 0 0 20px 10px;} 
.h-base-q {
	margin: 0 0 20px 0px;} 

p {margin-bottom: 10px;}
.p0 {margin-bottom: 0px;}
.indent-1em {padding-left:1em;}
.reg {
	text-transform: uppercase;
}
.fleft {
	float: left;
}
.fright {
	float: right;
}
.alignright {
	text-align: right;
}
.aligncenter {
	text-align: center;
	text-align-last:center;
}
.title {
	margin-bottom: 18px;
}
.it {
	font-style: italic;
}
.letter {
	letter-spacing: -1px;
}
.color-1 {
	color: #fff;
}
.color-2 {
	color: #000;
}
.color-3 {
	color: #404040; /* important */
}
.color-4 {
	color: #E0746F;
}
.color-5 {
	color: #d65751; /* 紅 */
}
.color-note {
	color: #F00; /* 金赤 */
}

.sml {
	font-size: 86%;
	}

.bold {
    font-weight: bold;
}

/*********************************boxes**********************************/
.rad  {  
border: #ccc 1px solid; 
        border-radius: 10px;        /* CSS3草案 */  
        -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
        -moz-border-radius: 10px;   /* Firefox用 */ 
		background-color: #FFF; 
    }
	   
.rad_nb { 
border: #fff 1px solid; 
		border-radius: 10px;        /* CSS3草案 */  
        -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
        -moz-border-radius: 10px;   /* Firefox用 */ 
		background-color: #FFF; 
    }  

.indent2 {padding: 48px 0 0 30px;}
.img-space {
	float: left;
	margin: 2px 20px 10px 0;
}
.img-space2 {
	float: left;
	margin: 0 13px 0px 0;
}
.img-space-r {
	float: right;
	margin: 0 0px 0px 40px;
}
.inner-top {margin-top: -8px;}

.buttons a:hover {
	cursor: pointer;
}
.menu li a, .list-1 li a, .link, .button, .button2, .logo {
	text-decoration: none;
}







/*********************************header*************************************/
header {
	width: 100%;
	background: #fff;
	margin-bottom: -90px;
	min-height: 260px;
}
h1 {
	padding: 18px 0 0 6px;
	position: relative;
	float: left;
}
.logo {
	display: block;
}
.logo strong {
	color: #6e3bb9;
	font-style: italic;
}
.slogon {
	display: block;
	font-size: 17px;
	line-height: 1.2em;
	color: #727272;
	font-weight: normal;
}


/**** search-form ****/
#search-form {
	padding: 30px 32px 5px 0;
}
#search-form fieldset {
	position: relative;
	width: 100%;
	display: block;
	overflow: hidden;
}
#search-form .search-field {
	width: 165px;
	background: url(../images/search-input-tail.gif) 0 0 repeat-x;
	border-top: 1px solid #d2d2d2;
	border-left: 1px solid #d2d2d2;
	border-bottom: 1px solid #d2d2d2;
	border-radius: 6px 0 0 6px;
	-moz-border-radius: 6px 0 0 6px;
	-webkit-border-radius: 6px 0 0 6px;
	float: right;
	margin-right: 25px;
}
#search-form input {
	color: #727272;
	width: 131px;
	font-size: 15px;
	padding: 5px 10px 5px 18px;
	font-family: Arial, Helvetica, sans-serif;
	background: none;
	border: none;
	margin: 0;
	outline: none;
}
#search-form .search-button {
	display: block;
	width: 29px;
	height: 29px;
	text-indent: -5000px;
	background: url(../images/search-button-tail.gif) 0 0 repeat-x #000;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	position: absolute;
	right: 0;
	top: 0;
}
#search-form .search-button span {
	display: block;
	background: url(../images/search-marker.png) 9px 11px no-repeat;
}
#search-form .search-button:hover {
	background: #000;
}




.row-top {
	width: 100%;
	min-height: 90px;
	background: url(../images/row-top.gif) center top repeat-x #fff;
	border-bottom: 5px solid #f2f2f2;
}
.row-bot {
	width: 100%;
	background: url(../images/row-bot-bg.jpg) center top repeat-x;
	min-height: 190px;
}
#page1 .row-bot {
	min-height: 300px;
}
.row-bot-shadow {
	width: 100%;
}


/********************
 * FEATURE CAROUSEL *
 ********************/
.carousel-container {
 /* position:relative;*/
  width:960px;
  margin:0 auto;
}
#carousel {
	height: 450px;
	width: 960px;
	position: relative;
}
.carousel-image {
  border:0;
  display:block;
}
.carousel-feature {
  position:absolute;
  /*top:-1000px;*/
  top:0px;
 /* left:-1000px;*/
  cursor:pointer;
}




/***** menu *****/
.menu {
	padding: 0;
	width: 100%;
	height: 63px;
}
.menu ul {
	text-align:center;
}
.menu li {
	float: left;
	display:inline-block;
	position: relative;
	margin-right: 2px;
}
.menu li.last {
	margin: 0;
}
.menu li a {
	display: block;
	position: relative;
	font-size: 17px;
	line-height: 1.23em;
	padding: 15px 0 17px 0;
	color: #fff;
	text-align: center;
	text-align-last: center;
	text-transform: uppercase;
	letter-spacing: -1px;
	width: 155px;
	background: url(../images/menu-li-bg.png) left top repeat-x;
	border-radius: 0 0 5px 5px;
/*	-moz-border-radius: 0 0 5px 5px;
	-webkit-border-radius: 0 0 5px 5px;*/
}
.menu li strong {
	display: none;
	width: 100%;
	height: 5px;
	background: url(../images/menu-border-top.gif) center top repeat-x;
	position: absolute;
	left: 0;
	top: -5px;
	z-index: 99;
}
.menu li.active a, .menu li a:hover {
	background-position: left bottom;
}
.menu li.active a, .menu li a:hover {
	color: #24368E;
	padding: 15px 0 27px 0;
}
.menu li.active strong, .menu li:hover strong {
	display: block;
}





/*********************************content*************************************/
#content {
	width: 100%;
	padding: 39px 0 58px 0;
	background: url(../images/body_bg0.png) repeat #fff;
	background: url(../images/content-bg.png) repeat #fff;
}
#page1 #content {
	padding: 90px 0 60px 0;
}
.spacer-1 {
	width: 100%;
	background: url(../images/pic-2.gif) 345px 0 repeat-y;
}
.spacer-2 {
	width: 100%;
	background: url(../images/pic-2.gif) right 0 repeat-y;
}
.spacer-3 {
	width: 100%;
	background: url(../images/pic-2.gif) 0 0 repeat-y;
}
.spacer-4 {
	width: 100%;
	background: url(../images/pic-2.gif) 666px 0 repeat-y;
}
.spacer-5 {
	width: 100%;
	background: url(../images/pic-2.gif) 586px 0 repeat-y;
}
.mag-1 {
	border-left: 1px solid #b7b7b8;
	padding-left: 30px;
}
.mag-2 {
	border-right: 1px solid #b7b7b8;
	padding-right: 30px;
}

h2 {
	display:block;
	font-size: 23px;
	line-height: 1.217em;
	padding: 6px 0;
	margin: 0px 0 16px 0;
	color: #202020;
	font-weight: normal;
	letter-spacing: 1px;
}
h2 span {
	font-size: 13px;
	line-height: 1.217em;
	margin: 0 0 10px 10px;
	color: #aaa;
	font-weight: normal;
	letter-spacing: 0px;
}
h3 {
	font-size: 20px;
	line-height: 1.2em;
	padding: 6px 0;
	margin: 0 0 10px 0;
	color: #336699;
	color: #111;
	font-weight: normal;
}
h4 {
	font-size: 18px;
	line-height: 1.2em;
	padding: 6px 0;
	margin: 0 0 10px 0;
	color: #336699;
	font-weight: normal;
}
h4 span {
	font-size: 13px;
	line-height: 1.2em;
	font-weight: normal;
}
h5 {
	font-size: 14px;
	line-height: 1.2em;
	padding: 6px 0;
	margin: 0 0 6px 0;
	color: #333;
}
h6 {
	color: #000;
	margin-bottom: 10px;
}
.title-1 {
	/*display: block;*/
	font-size: 30px;
	line-height: 1.2em;
	color: #d65751;
	font-weight: normal;
	letter-spacing: 1px;
	/*margin: 5px auto;*/
}
.title-2 {
	/*display: block;*/
	font-size: 24px;
	line-height: 1.21em;
	color: #666;
	font-weight: normal;
	letter-spacing: 1px;
}
.title-3 {
	/*display: block;*/
	font-size: 16px;
	line-height: 1.4em;
	color: #202020;
	font-weight: normal;
}
.title-4 {
	/*display: block;*/
	font-size: 18px;
	line-height: 1.21em;
	color: #d65751;
	font-weight: normal;
	letter-spacing: 1px;
}
.color4 {
	color: #d65751;
}
.block {
	display:block;
}
.border-bot {
	width: 100%;
	padding-bottom: 30px;
	background: url(../images/pic-2.gif) 0 bottom repeat-x;
}
.border-bot2 {
	width: 100%;
	padding-bottom: 35px;
	background: url(../images/pic-2.gif) 0 bottom repeat-x;
}
.border-bot3 {
	width: 100%;
	padding-bottom: 15px;
	margin-bottom: 15px;
	background: url(../images/pic-2.gif) 0 bottom repeat-x;
}
.box {
	width: 100%;
	min-height: 295px;
	background: url(../images/bg-box.png) 0 0 repeat;
}
.button {
	display: inline-block;
	font-size: 16px;
	line-height: 1.208em;
	padding: 7px 20px 9px;
	color: #fff;
	background: url(../images/button-tail.gif) left top repeat-x #010101;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	font-style: italic;
	letter-spacing: -1px;
}
.button:hover {
	background: #010101;
	text-decoration: none;
}
.button2 {
	display: inline-block;
	font-size: 12px;
	line-height: 1.22em;
	padding: 2px 26px 3px;
	margin:10px 0 0 0;
	color: #fff;
	background: url(../images/button2-tail.gif) left top repeat-x #010101;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
.button2:hover {
	background: #010101;
}

.buttonBack {
	display: inline-block;
	font-size: 13px;
	line-height: 1.22em;
	padding: 2px 26px 3px;
	margin:10px 0 0 0;
	color: #fff;
	background: url(../images/button3-tail.gif) left bottom repeat-x #666;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
.buttonBack:hover {
	background: url(../images/button3-tail.gif) left top repeat-x #666;
}


.list-1 li {
	padding: 0 0 23px 25px;
	background: url(../images/marker-2.gif) 0 5px no-repeat;
}
.list-1 li.last {
	padding: 0 0 0 25px;
}
.list-1 li span {
	display: block;
}
.list-1 li a {
	font-weight: bold;
	display: inline-block;
	margin-bottom: 3px;
}
.list-1 li a:hover {
	text-decoration: underline;
}
.list-2 li {
	padding: 0 0 19px 25px;
	background: url(../images/marker-2.gif) 0 5px no-repeat;
}
.list-2 li.last {
	padding: 0 0 0 25px;
}
.list-2 li a {
	display: inline-block;
}
.list-2 li a:hover {
	text-decoration: none;
}
.link:hover {
	text-decoration: underline;
}
.link-1 {
	display: block;
	height: 1.2em;
	background: url(../images/marker.gif) left 3px no-repeat;
	cursor: pointer;
	padding-left: 10px;
	margin-top: 7px;
}
.link-2 {
	display: inline-block;
	padding-left: 28px;
	background: url(../images/marker-3.gif) 0 4px no-repeat;
}
.link-2:hover {
	text-decoration: none;
}
dl.n_scroll{
	height: 200px;
	overflow:scroll;
}
dl.n_scroll dt,
dl.n_scroll dd {
	width: 90%;
}
dl.n_scroll dd {
	margin-bottom: 10px;
}
dl.n_scroll dd.none {
	margin-bottom: 0px;
}
dl.n_scroll dt {
	display: block;
	color: #000;
	font-weight: bold;
}
.text-1 {
	font-size: 14px;
}
.text-2 {
	font-size: 14px;
	line-height: 1.285em;
}
dl dt {
	font-weight: bold;
	color: #333;
}
dl span {
	float: left;
	width: 5em;
}
dl span.contact {
	float: left;
	width: 9em;
}
dl.news dt {
	font-weight: normal;
}
dl.exa-list dt, dl.exa-list dd {
	margin-bottom:0.8em;
}
.page-diy dl span {
	float:none;
}
.page-diy dl.diy dd {
	padding-left: 1em;
}
.page-diy dl.diy dd.end {
	margin-bottom: 10px;
}
.page-diy  dl.diy dd ul {
	padding-left: 2em;
}
.page-diy  dl.diy dd ul li.end {
	margin-bottom: 15px;
}

/*====== table ================*/
table, table.portrait {
	width: 100%;
	border: 1px solid #b7b7b8;
}
table th, table td {
	border: 1px solid #b7b7b8;
	line-height: 24px;
	padding:3px 10px;
	color: #222;
}
table.koudo th,
table.koudo tr {
	text-align:left;
	vertical-align:middle;
	font-weight: normal;
	padding:6px 12px;
	font-size: 1.1em;
}
th.w30 {
	width: 30%;
}


/***** Contact form *****/
#contact-form {
	display: block;
}
#contact-form label {
	display: block;
	height: 33px;
	overflow: hidden;
}
#contact-form input {
	float: left;
	width: 70%;
	font-size: 13px;
	line-height: 1.23em;
	color: #404040;
	padding: 5px 10px;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid #e5e5e5;
	/*background: none;*/
}
#contact-form textarea {
	float: left;
	height: 208px;
	overflow: auto;
	width: 70%;
	font-size: 13px;
	line-height: 1.23em;
	color: #404040;
	padding: 3px 10px;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid #e5e5e5;
	/*background-color:#FEFEFE;*/
}
.text-form {
	float: left;
	display: block;
	font-size: 13px;
	line-height: 1.23em;
	width: 82px;
	color: #404040;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 3px;
}
.buttons {
	padding: 20px 7px 0 0;
	text-align: right;
}
.buttons a {
	margin-left: 10px;
}




/******************  #submenu   ************************/
/****************************r************************/

#submenu {
	width: 100%;
	background: url(../images/row-sub-bg.jpg) center bottom repeat-x;
	padding: 20px 0px;
}

#submenu .btn03 {
	border: #fff 1px solid;
	background: #cecece;
	font-size: 16px;
	line-height: 16px;
	border-radius: 6px;
	/*-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	text-align:center;*/
    text-align: center;
    text-align-last: center;
}
#submenu .btn03:hover {
	background: #dedede;
	}

#submenu .btn03 h3 {
	margin: 0 auto;
	height: 1em;
}
#submenu a {
	color: #333;
	}
#submenu a:hover {
	}


/******************  footer   ************************/
/****************************r************************/

footer {
	width: 100%;
	background: url(../images/row-bot-bg.jpg) center bottom repeat-x;
	padding: 30px 0 50px;
	color: #fff;
}
.footer-text {
	font-size:12px;
	display: block;
	line-height: 20px;
}
.footer-text a {
	color: #fff;
}
.footer-text a:hover {
	color: #91C0EF;
}
.footer-text span {
	display: block;
}
.footer-text span.h {
	font-weight:bold;
	margin-bottom: 10px;
}
.copyright {
	font-size:11px;
	display: block;
	line-height: 16px;
}
.copyright a{
	color: #91C0EF;
	text-decoration: none;
}
.copyright a:hover{
	text-decoration: underline;
}
.support-phone {
	font-family:"Times New Roman", Times, serif;
	display: block;
	font-size: 36px;
	line-height: 1.2em;
	color: #ccd8ff;
	letter-spacing: 1px;
	margin-top: -3px;
}
.support-phone strong {
	display: inline-block;
	font-size: 27px;
	line-height: 1.22em;
	color: #FFF;
	padding: 6px 6px 0 0;
}

.list-services {
	font-size: 11px;
	padding: 0px 0 0 8px;
	border-left: #91C0EF 1px solid;
}
.list-services li {
	padding: 0 14px 0 0;
}
.list-services li a {
	color: #FEFEFE;
	text-decoration: none;
}
.list-services li a:hover {
	text-decoration: underline;
}

/******  button  *********/

footer a.button-1 {
	display: inline-block;
	background: #333;
	border-radius: 3px;
	color: #fff;
	font-size: 20px;
	padding: 10px ;
	text-decoration: none;
}
footer a.button-1:hover {
	background: #cecece;
	color: #222;
}

/****box+border*******/
.bd04 {
	border: #729fcc 4px solid;
	background:#ebf5ff;
}
.bd03 {
	border: #dfdfdf 3px solid;
}
#page1 .extra.bd04 {
	min-height: 12em; 
}
#page1 .bn_news {
	border: #729fcc 4px solid;
	background:#ebf5ff;
	border-radius: 8px;
	padding: 10px;
}

/**********************/
/*      go to top     */
/**********************/
#page-top {
    position: fixed;
    bottom: 10px;
    right: 20px;
	font-size: 12px;
}
#page-top a {
    background: #336699;
    text-decoration: none;
    color: #fff;
    width: 120px;
    padding:15px 0;
    text-align: center;
    text-align-last: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
	
				
/**********************/
/*      余白指定      */
/**********************/

.mg_t05 { margin-top:5px; }
.mg_t10 { margin-top:10px; }
.mg_t15 { margin-top:15px; }
.mg_t20 { margin-top:20px; }
.mg_t25 { margin-top:25px; }
.mg_t30 { margin-top:30px; }
.mg_t35 { margin-top:35px; }
.mg_t40 { margin-top:40px; }

.mg_r05 { margin-right:5px; }
.mg_r10 { margin-right:10px; }
.mg_r15 { margin-right:15px; }
.mg_r20 { margin-right:20px; }
.mg_r25 { margin-right:25px; }
.mg_r30 { margin-right:30px; }
.mg_r35 { margin-right:35px; }
.mg_r40 { margin-right:40px; }
.mg_r45 { margin-right:45px; }
.mg_r60 { margin-right:60px; }

.mg_L05 { margin-left:5px; }
.mg_L10 { margin-left:10px; }
.mg_L15 { margin-left:15px; }
.mg_L20 { margin-left:20px; }
.mg_L25 { margin-left:25px; }
.mg_L30 { margin-left:30px; }
.mg_L40 { margin-left:40px; }
.mg_L50 { margin-left:50px; }
.mg_L60 { margin-left:60px; }
.mg_L70 { margin-left:70px; }
.mg_L80 { margin-left:80px; }

.mg_b0 { margin-bottom:0px; }
.mg_b05 { margin-bottom:5px; }
.mg_b10 { margin-bottom:10px; }
.mg_b15 { margin-bottom:15px; }
.mg_b20 { margin-bottom:20px; }
.mg_b25 { margin-bottom:25px; }
.mg_b30 { margin-bottom:30px; }
.mg_b35 { margin-bottom:35px; }
.mg_b40 { margin-bottom:40px; }
.mg_b45 {margin-bottom: 45px;}

.pd_L05 { padding-left:5px;}
.pd_L10 { padding-left:10px;}
.pd_L15 { padding-left:15px;}
.pd_L20 { padding-left:20px;}
.pd_L25 { padding-left:25px;}
.pd_L30 { padding-left:30px;}
.pd_L35 { padding-left:35px;}
.pd_L40 { padding-left:40px;}
.pd_L60 { padding-left:60px;}
.pd_L70 { padding-left:70px;}
.pd_L80 { padding-left:80px;}
.pd_L90 { padding-left:90px;}
.pd_L100 { padding-left:100px;}

.pd_r05 { padding-right:5px;}
.pd_r10 { padding-right:10px;}
.pd_r15 { padding-right:15px;}
.pd_r20 { padding-right:20px;}
.pd_r30 { padding-right:30px;}
.pd_r40 { padding-right:40px;}
.pd_r50 { padding-right:50px;}

.pd_b05 { padding-bottom:5px;}
.pd_b10 { padding-bottom:10px;}
.pd_b15 { padding-bottom:15px;}
.pd_b20 { padding-bottom:20px;}
.pd_b25 { padding-bottom:25px;}
.pd_b30 { padding-bottom:30px;}

.pd_t05 { padding-top:5px;}
.pd_t10 { padding-top:10px;}
.pd_t15 { padding-top:15px;}
.pd_t20 { padding-top:20px;}
.pd_t25 { padding-top:25px;}
.pd_t30 { padding-top:30px;}


@media only screen and (max-width: 767px) {
	.zerogrid .col-1-4.chaofirst,
	.zerogrid .col-1-3.chaofirst
	{width:50%;}
	.zerogrid .col-1-4.chaofirst img
	{padding-left: 50%;}
	.zerogrid .col-3-4.mokuji
	{width:100%;}
    .zerogrid .col-2-3.mokuji
	{width:48%;}
	.zerogrid .col-3-4.mokuji
	{padding-left: 22%;}
}

@media only screen and (max-width: 640px) {
	.zerogrid .col-1-3.chaofirst
	{width:50%;}
	.zerogrid .col-1-3.chaofirst img
	{width: 70%;
    padding-left: 35%;}
	.zerogrid .col-2-3.mokuji{
    width:45%;
    padding-left: 1%;
    padding-top:2%;}
}
@media only screen and (max-width: 480px) {
	.zerogrid .col-1-4.chaofirst
	{width:80%;}
	.zerogrid .col-1-4.chaofirst img
	{padding-left: 20%;}
}

@media only screen and (max-width: 360px) {
	.zerogrid .col-1-4.chaofirst
	{width:100%;}
	.zerogrid .col-1-4.chaofirst img
	{padding-left: 3%;}
	.zerogrid .col-3-4.mokuji
	{padding-left: 3%;}
    
	.zerogrid .col-1-3.chaofirst
	{width:50%;
    padding-left: 0%;}
	.zerogrid .col-2-3.mokuji{
    width:45%;
    padding-left: 1%;}
}
