@charset "utf-8";
@import url("../hp_agency/hpagency.css");
/*-------------------------------------------
グリーン01 グリーン 右メイン
-------------------------------------------*/
body, #contents{
 	font-size:16px;
 	line-height:1.7;
  	letter-spacing: 0.06em;
    -webkit-font-smoothing: antialiased;
    font-family: "Montserrat","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","游ゴシック",YuGothic,"メイリオ",Meiryo,sans-serif;
}

/*リンク*/

a {
    color: #001748;
	text-decoration:underline;
}
a:hover {
    color: #FF0000;
	text-decoration:underline;
}

#wrap{
  /* border-top: 5px solid #001748; */
}
#wrap_body{
	padding-top:0px;
}

#mainImage, #mainImage_outer {
	background: none;
}

/*-------------------------------------------
column
-------------------------------------------*/
.col{
	display:flex;
	align-items: center;
}
.col .col_item{
/*	margin-right:10px;*/
	box-sizing:border-box;
	margin-bottom:26px;
}

.flexWrap{
	flex-wrap:wrap;
}
.spaceBetween{
	justify-content: space-between;
}
.spaceAround{
	justify-content: space-around;
}

.col2 .col_item{
	width:48%;
	margin-right:2%;
}
.col2 .col_item:nth-of-type(2n){
	margin-right:0;
}

.col3 .col_item{
	width:32%;
	margin-right:1.333333%;
}
.col3 .col_item:nth-of-type(3n){
	margin-right:0;
}

.col4 .col_item{
	width:23%;
	margin-right:26px;
}
.col4 .col_item:nth-of-type(4n){
	margin-right:0;
}

/*-------------------------------------------
card
-------------------------------------------*/
.card{
	text-align:center;
	padding:10px;
	border:solid 5px #2C71B8;
	position:relative;
	width:250px;
	max-width:100%;
	height:100px;
/*	font-size:120%;*/
	font-weight:bold;

/*
	color:#2C71B8;
	background-color: #CAE9FF;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #E7F8FC), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #E7F8FC),color-stop(.75, #E7F8FC), color-stop(.75, transparent),to(transparent));
	-webkit-background-size: 7px 7px;
*/

	background:#2C71B8;
	color:#fff;
}
.middle{
	position:absolute;
	top:50%;
	left:0;
	transform:translate(0, -50%);
	width:100%;
}


/*-------------------------------------------
text
-------------------------------------------*/

.strong{
	font-weight:bold;
	color:#dc143c;
	display:inline-block;
	margin:0 4px;
	font-size:112%;
}


/*マーカー*/
span[style*="Lime"] {
    background-color: #FFF !important;
    color: #096;
    border-bottom: 1px dashed;
	font-weight:bold;
}
/*
span[style*="Yellow"] {
	background: linear-gradient(transparent 80%, #ffe266 80%) !important;
	border-radius:0px;
	font-weight: bold;
}
*/
span[style*="Yellow"] {
    background: linear-gradient(transparent 0%, #ffedab 0%) !important;
    border-radius: 0px;
    font-weight: bold;
}


.envelope{
    margin: 2em auto;
    padding: 1em;
    width: 90%;
    background-color: #FFF5EE;
    border: solid 1px #f4a460;
}
.box{
	background: none;
	border: 1px solid #6bb6ff;
	margin: 10px;
	padding: 20px;
	position: relative;
}
.box:after{
	background: none;
	border: 1px solid #6bb6ff;
	content: '';
	position: absolute;
	top: 3px;
	left: 3px;
	width: 100%;
	height: 100%;
}

.box_red {
    padding: 0.5em 1em;
    margin: 2em 0;
    border: double 5px #CF7578;
    font-size: 120%;
    font-weight: bold;
    color: #CF7578;
    text-align: center;
}
.box_red p {
    margin: 0;
    padding: 0;
}

.box_a {
    position: relative;
    margin: 2em 0;
    padding: 0;
    border: solid 3px #62c1ce;
}
.box_a .box_title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 3px 10px 0 10px;
    line-height: 1.5;
    font-size: 16px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 4px 4px 0 0;
}
.box_a .box_content {
    padding: 10px 20px;
}
.box_a p {
    margin: 0;
    padding: 0;
}
/*-------------------------------------------
title
-------------------------------------------*/

#title{
	padding-top:0px;
	padding-bottom:0px;
	background:none;
}


#title_outer {
    background: url(../materials/158140541560501.png) no-repeat right top 20px;
    background-size: 300px;
}


#title h1 {
    margin: 0;
    padding: 0;
    text-align: left;
}
#title h1 a {
    display: inline-block;
    overflow: hidden;
    text-indent: 110%;
    white-space: nowrap;
    background: url(../materials/158140458076301.png) no-repeat center;
    width: 350px;
    height: 80px;
    background-size: contain;
}


#title .description{
	font-size: 16px;
	margin: 0;
	color:#555;
	text-align:left;
	padding:0;
}

/*-------------------------------------------
Topmenu
-------------------------------------------*/
#topMenu_outer{

}

#topMenu {

}
#topMenu .topMenu li {

}
#topMenu .topMenu li a {
  -webkit-font-smoothing: subpixel-antialiased;
}
#topMenu .topMenu li.fifth a{

}

#topMenu .topMenu li a:hover, #topMenu .topMenu li.fifth a:hover{

}

/*-------------------------------------------
mainArticles
-------------------------------------------*/
#mainArticles{
	margin-bottom:5px;
}
.article p {
margin-bottom: 12px;
}
.mainArticles .article{
	border-bottom:none;
	padding-bottom:5px;
}
#mainTopics .topics li .more a {
    padding: 4px 14px;
    font-size: 14px;
    border: none;
    background: #a3d6cc;
    color: #00984f;
}
/*-------------------------------------------
見出し
-------------------------------------------*/
#mainArticles h2 {
    border: none;
    position: relative;
    display: block;
    margin: 1em auto;
    text-align: center;
/*    color: #0eb68a;*/
	color:#333;
    font-weight: bold;
    font-size: 160%;
}
#mainArticles h2::before {
  content: '';
  position: absolute;
  bottom: 5px;
  display: block;
  width: 100px;
  height: 2px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #0eb68a;
  border-radius: 0px;
}

/*
#mainArticles h3,#mainServices h2,#listTopics h2,.mainContents div.gallery h3 {
  position: relative;
  display: block;
  padding: 0 27%;
  font-size:150%;
  font-weight:normal;
  text-align:center;
  margin:30px auto;
	color:#2C71B8;
}

#mainArticles h3::before,#mainServices h2::before,
#listTopics h2::before,.mainContents div.gallery h3::before,
#mainArticles h3::after,#mainServices h2::after,
#listTopics h2::after,.mainContents div.gallery h3::after {
  content: '';
  position: absolute;
  top: 50%;
  display: block;
  width: 26%;
  height: 1px;
  background-color:#2C71B8;
}

#mainArticles h3::before,#mainServices h2::before,
#listTopics h2::before,.mainContents div.gallery h3::before {
  left:0;
}
#mainArticles h3::after,#mainServices h2::after,
#listTopics h2::after,.mainContents div.gallery h3::after {
  right: 0;
}
*/
.mainContents .article h3, #mainTopics h2, .mainContents div.gallery h3 {
	padding: 6px 14px;
    border: none;
    border-left: solid 10px #00984f;
    /* background: #0eb68a; */
    background: repeating-linear-gradient( -45deg, #bee0ce, #BCE0CE 3px, #7EC8AE 3px, #7EC8AE 7px );
    font-size: 120%;
    color: #333;
    background: #bee0ce;
/*
    padding: 6px 14px;
    border: none;
    border-left: solid 10px #00984f;
	background: #0eb68a;
    background: repeating-linear-gradient( -45deg, #bee0ce, #BCE0CE 3px, #e0ebaf 3px, #e0ebaf 7px );
    font-size: 120%;
    color: #fff;
*/

}

.article h3 a,
.article h3 a:hover {
color: #2C71B8;
text-decoration: none;
}
.mainContents .article h4 {
	padding: 2px 0 0 14px;
	border-left: 6px solid #2C71B8;
	color: #2C71B8;
	line-height: 1.6em;
	font-size: 130%;
	overflow:hidden;
}
h5 {
	font-size: 116%;
	margin: 18px 0 8px;
}
/*-------------------------------------------
table
-------------------------------------------*/

.article table p {
    margin: 0;
}
.article table:not(.contactTable) {
    border-collapse: collapse;
    border-left: 1px solid #ccc;
    border-spacing: 0;
    border-top: 1px solid #ccc;
    margin: 10px auto;
  	width:100%;
}
.article table:not(.contactTable) td,
.article table:not(.contactTable) th {
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    height: auto;
    padding: 10px;
    box-sizing: border-box;
}
.article table:not(.contactTable) th {
    background-color: #f7f7f7;
    text-align: center;
}
/*汎用*/
.article table.normalTbl {
    border-left: 1px solid #DDD;
    border-top: 1px solid #DDD;
    margin: 15px 0;
}
.article table.normalTbl th {
	background: #EEF;
	height: auto;
	line-height: 150%;
	padding: 20px;
	text-align: center;
	vertical-align: middle;
	border-bottom: 1px solid #DDD;
	border-right: 1px solid #DDD;
    font-weight:normal;
}
.article table.normalTbl td {
	border-bottom: 1px solid #DDD;
	border-right: 1px solid #DDD;
	height: auto;
	line-height: 150%;
	padding: 20px;
}

.article table.halfTbl{
	width:48%;
}


.article table.schedule{
	width:100%;
}
.article table.schedule thead{

}
.article table.schedule thead th{
	background:#D9E6E6;
}

.article table.schedule tbody th{
	background:#D9E6E6;
}
.article table.schedule tbody td{
	text-align:center;
}






.article table.scrollboxTbl {
    border-collapse: collapse;
    border-left: 1px solid #ccc;
    border-spacing: 0;
    background-color: #f7ffff;
    border: 1px solid #eee;
    width: 100%;
}
.article table.scrollboxTbl td {
    box-sizing: border-box;
    height: 200px;
    display:inline-block;
    overflow: auto;
    padding: 10px;
    width: 100%;
}







.freeHtml{
	font-size:inherit;
}
.freeHtml_body table {
    border-collapse: collapse;
    border-spacing: 0;
    margin: 10px auto;
    width: 100%;
}
.freeHtml_body table td,
.freeHtml_body table th {
    border-bottom: 1px solid #ccc;
    height: auto;
    padding: 10px 20px;
    box-sizing: border-box;
}
.freeHtml_body table th {
    border-bottom: solid 1px #222;
}

/* #sideContents */
#sideContents .freeHtml_body table th{
   /* background: url(../themes/pc/html1/01_003/colors/grn/bg_side_service.gif) bottom left; */
    border-bottom: solid 2px #02946d;
    background: #0eb68a;
    color: #fff;
}
#sideContents .freeHtml_body table td{
    border-bottom:0;
    background: #CBFADF;
    font-weight: bold;
}


/*-------------------------------------------
faq
-------------------------------------------*/
ul.faq {
	padding: 10px 0 20px;
}
ul.faq li.qus:before ,
ul.faq li.ans:before {
	border-radius:100%;
	color: #fff;
	display: block;
	float: left;
	font-size: 115%;
	width: 32px;
	height: 32px;
	line-height: 32px;
	margin-left: -40px;
	text-align: center;
}
ul.faq li.qus:before {
	background-color: #0eb68a;
	content: "Q";
}
ul.faq li.ans:before {
	background-color: #FF4D4D;
	content: "A";
}
ul.faq li.qus ,
ul.faq li.ans {
	display: block;
	padding-left: 45px;
	margin-bottom: 20px;
}
ul.faq li.qus{
	font-weight:bold;
}
/*-------------------------------------------
フロー
-------------------------------------------*/
table#flowTbl {
    border-collapse: collapse;
    border-spacing: 0;
    border: none;
    margin: 10px auto;
    width: 100%;
}
#flowTbl td {
  	border: 2px solid #00984f;
  	background: #fafafa;
    display: block;
    height: auto;
    margin-bottom: 76px;
    padding: 4%;
    position: relative;
}
#flowTbl td::after {
    color: #00984f;
    content: "▼";
    font-size: 48px;
    left: 50%;
    margin: auto;
    position: absolute;
    text-align: center;
    top: 100%;
    transform: scaleY(0.6) translate(-50%,0);
}
#flowTbl tr:last-child td {
    margin-bottom: 0;
    background: #f0f6da;
}
#flowTbl tr:last-child td::after {
    display:none;
}
#flowTbl td strong {
    color: #00984f;
    display: block;
    font-size: 130%;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 5px;
}



/*-------------------------------------------
フォーム
-------------------------------------------*/

table.contactTable tr td label {
    display: block;
    margin-left: 6px;
}
table.contactTable th {
    width: 30%;
    background: #fff;
}
table.contactTable th, table.contactTable td {
    padding: 16px 5px;
    border-top: solid 1px #aaa;
}
table.contactTable input.button, table.contactTable input[type="button"] {
    display: block;
    float: left;
    line-height: 40px;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    text-align: center;
    height: 60px;
    margin: 8px;
    margin-bottom: 16px;
    border: none;
    border-radius: 2px;
  	cursor: pointer;
}
table.contactTable input.button:hover,table.contactTable input[type="button"]:hover {
    filter: alpha(opacity=75);
    -moz-opacity: 0.75;
    opacity: 0.75;
}
table.contactTable input.button{
	width: 33%;
    background: #004;
    border: 1px solid #004;
}
table.contactTable input.button:hover {
    background: #444;
    border: 1px solid #444;
}
table.contactTable input.button.btn-secondary{
	width: 33%;
    color: #004;
    background: #FFF;
    border: 1px solid #004;
}
table.contactTable input.button.btn-secondary:hover{
    color: #FFF;
    background: #004;
    border: 1px solid #004;
}
table.contactTable input[type="button"]{
	width: 100px;
	background: #aaa;
}
table.contactTable input[type="button"]:hover {
	background: #ccc;
}
table.contactTable input[type="text"],
 table.contactTable input[type="email"],
 table.contactTable input[type="password"],
  table.contactTable textarea {
    padding: 6px;
    border: solid 1px #b6b6b6;
    font-size: 16px;
    margin-left: 6px;
}
.validator-form .validator-message-valid,
.validator-form .validator-message-invalid{
    padding-left: 24px;
    font-size: 14px;
    padding-top: 2px;
}
.mainArticles .article p.contact-note {
    padding: 0;
    margin: 8px 5px 0;
    color: #666;
    font-size: 14px;
    line-height: 1;
}

table.contactTable .th_headline {
	font-weight:bold;
	background-color:#eee;
	text-align:center;
}
#article_contact_ext {
    font-size: 14px;
}


/*-------------------------------------------
フッター
-------------------------------------------*/
#footer {
    width: 100%;
}
#footer li {
    border-left: dotted 1px #a8eddc;
    display: inline-block;
}
.footer li a {
    font-size: 16px;
}
.footer .topMenu, .footer .services {

}
.footer .services li a {

}
.footer .copyright {

}
.footer .topMenu, .footer .services {
    width: 100%;
    float: left;
    min-height: 20px;
    height: auto !important;
    padding-bottom: 30px;
}
.footer li {

}
/* Footer */
.footer * {
    font-size: 16px;
}

/*-------------------------------------------
その他
-------------------------------------------*/
/*リンクつき画像がオンマウスで薄くなる*/
#mainArticles a:hover img,
#sideBanners  a:hover img,
div.freeHtml a:hover img,
div.image img.gallery:hover {
  filter: alpha(opacity=75);
  -moz-opacity:0.75;
  opacity:0.75;
}

/*リンクつき画像に枠線を表示しない*/
a img{
	text-decoration:none;
	border:none;
}
/*ぱんくず*/
#pankuz{
    font-size:14px;
}
/*コメント*/
.gallery_grid li.galleryGrid .comment {
	text-align:center;
}



/*サイト案内*/
.siteGuide li.galleryGrid .image {
    margin-bottom: 0;
}
.siteGuide .comment {
    font-size: 16px;
    color: #fff;
    border-bottom: none;
    padding: 3px;
    background: #2C71B8;
}
.siteGuide .galleryGrid_body {
    border: solid 1px #444;
}


/*-------------------------------------------
リンクボタン
-------------------------------------------*/
a.linkbtn {
    width: auto;
    max-width: 100%;
    margin: 1em auto;
    padding: 0.3em;
    border-radius: 4px;
    background: #FF6B2A;
    display: block;
    color: #fff;
    text-decoration: none;
    text-align: center;
    box-sizing: border-box;
/*    -webkit-transition: all .2s linear;*/
/*    transition: all .2s linear;*/
    float: none;
    position: relative;
    border-bottom: solid 4px #bc611e;
}

a.linkbtn:hover{
	background-color: #ff7f50;
}
a.linkbtn:active{
    border-bottom: none;
    top: 4px;
    margin-bottom: calc(1em + 4px);
}
/*link*/

.link-wrap {
    margin: 40px 20px;
}
.text-link {
    padding: 8px 20px;
    background: #0936ab;
    border-radius: 5px;
    text-align: center;
    margin: 5px 2px;
    color: #fff;
    text-decoration: none;
}
.text-link:hover {
    background: #1258df;
    color: #FFF;
  	text-decoration:none;
}
.notation-wrap{
    text-align: center;
    display: block;
    background-color: #e4ecff;
    border: solid 2px #001748;
    padding: 1em;
    margin: 1em 0;
    box-sizing: border-box;
}

/*------------------------
リスト類
-------------------------*/

ul.baseList {
    padding-left: 2em;
}
ul.baseList li {
    list-style-type: disc;
    padding: 0px;
}


ul.checkedList {
    list-style: outside none;
    line-height: 2;
/*    padding-left: 2.5em;*/
/*    width: 65%;*/
    margin: 0 auto;
}
ul.checkedList li {
    position: relative;
/*    font-size: 20px;*/
    border-bottom: dashed 1px #DDD;
    padding: 8px 0 8px 42px;
    margin-bottom: 10px;
    font-weight: bold;
}
ul.checkedList li::before {
    display: block;
    content: '';
    position: absolute;
    top: 1em;
    left: 0;
    width: 0.9em;
    height: 0.5em;
    border-left: 4px solid #a91111;
    border-bottom: 4px solid #ff3d3d;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}


ol.baseOrderedList{
    counter-reset: number 0;
    list-style: outside none none;
    line-height: 2;
    padding-left: 40px;
}

ol.baseOrderedList li {
    margin-bottom: 14px;
  	list-style-type: decimal;
}


/*ul*/
ul.StyleCheckList {
    list-style: outside none;
    line-height: 2;
	padding-left: 4em;
}
ul.StyleCheckList li {
    position: relative;
    font-size: 24px;
    font-weight: bold;
}
ul.StyleCheckList li::before {
    display: block;
    content: '';
    position: absolute;
    top: 0.4em;
    left: -2em;
    width: 0.9em;
    height: 0.5em;
    border-left: 4px solid #E55;
    border-bottom: 4px solid #E55;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}





ol.StyleOrderList {
    counter-reset: number 0;
    list-style: outside none none;
    padding-left: 40px;
}
ol.StyleOrderList li::before {
    background: #0eb68a;
    border-radius: 50%;
    color: #fff;
    content: counter(number, decimal);
    counter-increment: number 1;
    display: inline-block;
    height: 2em;
    margin-left: -40px;
    margin-right: 0.5em;
    text-align: center;
    width: 2em;
    font-family: monospace;
	line-height:2;
}
ol.StyleOrderList li {
    margin-bottom: 0.8em;
	line-height:1.8;
}

ol.StyleOrderList li .list_title{
	font-size:120%;
	font-weight: bold;
	color:#0377cd;
}





/*日付*/
#mainTopics .topics li p.date ,
#listTopics .topics li p.date {
    font-size: 14px;
    color: #999;
}
/*リンクタイトル*/
#mainTopics .topics li h3 ,
#listTopics .topics li h3 {
    font-size: 16px;
    font-weight: normal;
}
/*リード文*/
#mainTopics .topics li p.description ,
#listTopics .topics li p.description {
    color: #999;
    font-size: 14px;
}
/*続き*/
#mainTopics .topics li p.more ,
#listTopics .topics li p.more {
    font-size: 14px;
}
/*一覧を見る*/
#mainTopics .listview {
     font-size: 14px;
}

#mainTopics .listview a {
    display: block;
    margin: 0 auto;
    text-align: center;
    background: #f3f3f3;
    color: #444;
}


table.contactTable input[type="button"] {
    display: block;
    margin: 1em auto;
    width: 150px;
    height: 50px;
    font-size: 16px;
}

.sideServices ul li a {
    font-size: 16px;
}

.sideMobile p {
    font-size: 16px;
}