/*
Theme Name: 栃木第１団
Version: 1.1
*/

html,
body {
    width: 100%;
    overflow-wrap: anywhere; 
      word-break: normal; 
      line-break: strict;
}

body {
   font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: 16px;
    line-height: 2;
    color: #000;
    margin: 0;
    -webkit-text-size-adjust: none;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.clearfix {
    display: inline-block;
}

.clearfix {
    display: block;
}

div.clear {
    clear: both;
}

div.clear hr {
    display: none;
}

.breadcrumbs {
    padding: 2em 0 2em 0;
}

img{
	vertical-align:top;
}

a {
	color: #0056b5;
}

a:hover {
	text-decoration: none;
}


span.wpcf7-list-item { display: block; }

.point { display: inline-block; background: #08690b; color: #fff; font-size:18px; line-height: 1; font-weight:bold; padding: .6em 1em; border-radius: 30px;}

/* ----------------------------------------------
	PageNavi
------------------------------------------------*/

#pnavi {
	display: block;
	width: 100%;
	margin: 2em auto;
	padding-bottom: 3em;
}
.nav-previous a,.nav-next a { width:120px; background: #08690b; color: #fff; display: block; padding: .5em 1em; text-decoration: none; -webkit-transition: 0.5s; transition: 0.5s; text-align: center;}
.nav-previous a:hover,.nav-next a:hover { background: #2da631; color: #fff;}

#page-navi {
    width: 100%;
    margin: 3em 0;
    display: block;
    clear: both;
}

.wp-pagenavi {
    font-size: 14px;
}

.wp-pagenavi span.pages {
    width: 100px;
    display: block;
    margin: 0 auto 1em auto;
    padding: text-align: center;
    border: none;
}

.wp-pagenavi {
    display: block;
    text-align: center;
}

.smaller,
.larger {
    background:  #284b28;
}

.wp-pagenavi a {
    color: #fff;
    border: none;
    padding: 1em;
    text-decoration: none;
}

.wp-pagenavi a:hover {
    background: #206937;
    color: #fff;
}

.current {
    background: #284b28;
    color: #fff;
    border: none;
 border: solid 1px #fff;
}

.previouspostslink,
.nextpostslink,
.wp-pagenavi .first,
.wp-pagenavi .last {
    background: #284b28;
border: solid 1px #fff;    
}

.wp-pagenavi a,
.wp-pagenavi span {
    padding: 12px;
}

.cont-menu-wp {
	margin: 3em 0 4em 0;
}


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

input[type="text"],
textarea {
    vertical-align: middle;
    max-width: 90%;
    line-height: 30px;
    height: 30px;
    padding: 1px 5px;
    border: 1px solid #d4d4d7;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    font-size: 100%;
    color: #555;
    background: #fcfcfc;
}

input[type="text"].readonly {
    font-weight: bold;
    vertical-align: middle;
    width: 100%;
    line-height: 20px;
    height: 20px;
    padding: 1px 0;
    border: none;
    font-size: 100%;
    color: #555;
    background: #fff;
}

input[type="tel"],
textarea {
    vertical-align: middle;
    max-width: 90%;
    line-height: 30px;
    height: 30px;
    padding: 1px 5px;
    border: 1px solid #d4d4d7;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    font-size: 100%;
    color: #555;
    background: #fcfcfc;
}

input[type="email"],
textarea {
    vertical-align: middle;
    max-width: 90%;
    line-height: 30px;
    height: 30px;
    padding: 1px 5px;
    border: 1px solid #d4d4d7;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    font-size: 100%;
    color: #555;
    background: #fcfcfc;
}

textarea {
    height: auto;
    line-height: 1.5;
}

input[type="submit"],
input[type="reset"],
input[type="button"] {
    padding: .5em 3em;
    background: #007c1a;
    background: -moz-linear-gradient(top, #08690b 0%, #08690b 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #08690b), color-stop(100%, #08690b));
    background: -webkit-linear-gradient(top, #08690b7 0%, #08690b 100%);
    background: -o-linear-gradient(top, #08690b 0%, #08690b 100%);
    background: linear-gradient(to bottom, #08690b 0%, #08690b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#08690b', endColorstr='#1549aa', GradientType=0);
    border: 0;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    line-height: 1.5;
    font-size: 16px;
    color: #fff;
}

input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
    background: #2da631;
    background: -moz-linear-gradient(top, #2da631 0%, #2da631 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2da631), color-stop(100%, #2da631));
    background: -webkit-linear-gradient(top, #2da631 0%, #2da631 100%);
    background: -o-linear-gradient(top, #2da631 0%, #2da631 100%);
    background: linear-gradient(to bottom, #2da631 0%, #2da631 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2da631', endColorstr='#2da631', GradientType=0);
    cursor: pointer;
    -webkit-transition: all .8s;
    transition: all .8s;
}


*:first-child+html input[type="submit"] {
    padding: 3px;
}

#search {
    background: #e2e2e2;
    margin: 0;
    padding: 1em .5em;
    text-align: center;
}

#content .wpcf7-spinner {display: block;}

#mapbt { display: block; text-align: center; padding-top: .7em;}
#mapbt a {font-size: 14px; background:#ff5a00; display: inline-block; color:#fff; padding: .2em 2em; border-radius: 30px; text-decoration: none;  -webkit-transition: all .8s; transition: all .8s;}
#mapbt a:hover { background:#000;}
#vi-inner { display: block; position: relative;z-index: 1;}
#vi-inner img { width: 100%;}
#slcopy { width: 100%; display: block; position: absolute; top:25%; text-align: center; z-index: 100;}
.mcopy { font-size: 56px; font-weight: bold; line-height: 1.4; color: #fff; text-shadow: 0 0 10px #000000;}
.subcopy { font-size: 22px; font-weight: bold; color: #fff; text-shadow: 0 0 10px #000000;}
#ken a {  font-size: 22px; font-weight: bold; display: inline-block; color: #fff; background: #7f4733; border-radius: 60px; padding: .5em 2em; text-decoration: none; margin-top: 1em; -webkit-transition: all .8s; transition: all .8s;}
#ken a:hover {color: #fff; background: #000; }
.cpimg { width: 60%; height: auto; display: block; margin: auto;}
#contA { max-width: 1100px; width: 95%; display: block; margin: auto; padding: 3em 0;}
#contA h1,#contA h2 { font-size: 24px; display: block; text-align: center;}
#contA h2 { margin-bottom: 3em;}
#contA #lead { font-size: 18px; font-weight: bold; text-align: center; display: block; line-height: 2; margin-bottom: 3em;}
#contB { background: #f0e8c8 url(images/wkbk.jpg) no-repeat; background-size: contain; padding: 8em 0;}
#contB-inner { max-width: 1100px; width: 95%; display: flex; justify-content: center;  margin: auto; padding: 5em 0; }
#contB-inner section { flex:1; margin: 2%;}
#contB-inner section.bld { text-align: center;}
#contB h3 { font-family:serif; font-size: 36px; line-height: 1.8; text-align: left; }
#Bbt { display: block; }
#Bbt a { background: #2f901c; color: #fff; text-decoration: none; font-size:28px; line-height: 1; font-weight: bold; display: block; padding: 1em 1em; text-align: center;  -webkit-transition: all .8s; transition: all .8s;}
#Bbt a:hover { background: #000;}
#news { max-width: 1100px; width: 95%; display: block; text-align: center;  margin: auto; padding: 2em 0;}
#news h2 { font-size: 50px; margin: 0; padding: 0;}

#news-inner { display: flex; flex-wrap: wrap; margin-bottom: 2em;}
#news-inner section { flex-basis: 29%; margin: 2%; text-align: left;}
#news-inner .thum {
    max-width: 100%;
    height: 190px;
    overflow: hidden;
    margin-bottom: .5em;
}
#news-inner .thum img {
    width: 100%;
    height: auto;
    transform: scale(1);
    transition: .3s ease-in-out;
}
#news-inner a:hover .thum img{transform: scale(1.1);}
#news-inner a {text-decoration: none; color:#000;}
#news-inner .date {line-height: 1; margin: 0 0 .5em 0; padding: 0;}
#news-inner h4 { font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; font-size: 18px; line-height: 1.2; margin: 0 0 .2em 0; padding: 0;}
#news-inner p { font-size: 14px; line-height: 1.6;}
a.newsct { display: inline-block; text-decoration: none; font-weight: bold; color: #000; padding: .5em 3em; background: #fff;  -webkit-transition: all .8s; transition: all .8s;}
a:hover.newsct {background: #000; color: #fff;}

#contC { max-width: 900px; width: 95%; display: flex; justify-content: space-between;  margin: auto; padding: 4em 0;}
#contC section { flex-basis: 45%; margin: 2%;}
#contD { background: #397f55 url(images/ea.jpg) no-repeat top; background-size: 100%; padding:6em 0; }
#contD h2 { font-size: 60px; color: #fff; display: block; text-align: center; }
#contD-inner {max-width: 1100px; width: 95%; display: flex; justify-content: center; margin: auto;}
#contD-inner section { flex:1; margin: 2%; text-align: center;}
#contD-inner p { color: #fff; font-weight: bold;}
#footer {background: #7f4733;}
#footer-inner {max-width: 1100px; width: 95%; display: block; margin: auto; padding:6em 0; text-align: center; color:#fff;}
#flogo { font-size: 48px; font-weight:bold; line-height: 1; margin-bottom: .2em;}
#spl { font-size: 11px;}
#footer ul { margin: 3em 0; padding: 0; font-size: 14px;}
#footer li {list-style: none; display: inline-block;  line-height: 1; }
#footer li::before {content: "｜";}
#footer li.fslt::before{content:none;}
#footer a { color: #fff; text-decoration: none;}
#copyright{ font-size: 12px;}
.side-menu {
    position: fixed;
    top: 30%;
    right: 0px;
    z-index: 2;

}

.side-menu ul {margin: 0; padding: 0}
.side-menu li {margin: 0; padding: 0; list-style: none;}
.side-menu li a {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: .8rem;
    padding: 2em 1em;
    text-decoration: none;
    color: #fff;
    background:#597e23;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}


.side-menu li a:hover { background: #000;}

#content {max-width: 1100px; width: 90%; display: block; margin: auto;  }
#cont { padding: 2em 0 3em 0;}

#cont h1.cap { margin: 0 0 1em 0; padding: 0 0 .5em 0; border-bottom: solid 3px #253; line-height: 1.6;}
#cont h1 { font-size:34px;}
#cont h2 { font-size:26px;}
#cont h3 { font-size:24px;}
#cont h4 { font-size:22px;}
#cont h5 { font-size:20px;}
#cont h6 { font-size:18px;}
.cap2 {background:#2f4e3e; color: #fff; display: block; padding: .6em 1em;}
.date { font-size: 14px; margin-bottom: .5em;}
#cont #faq h2::before { content: "Q. ";}
ul.tag { margin: 0 0 2em 0; padding: 0; list-style: none;}
ul.tag li { display: inline-block;}
ul.tag li a { display: block; padding: .5em 1em;  margin: 2px; background: #2f4e3e; color: #fff; font-size: 12px; line-height: 1; text-decoration: none; -webkit-transition: 0.5s; transition: 0.5s;}
ul.tag li a:hover { background: #000;}
#blog { display: flex; flex-wrap: wrap;}
#blog section { flex-basis: 31%; margin: 1%;}
#blog .thum {
    max-width: 100%;
    height: 190px;
    overflow: hidden;
    margin-bottom: .5em;
}
#blog .thum img {
    width: 100%;
    height: auto;
    transform: scale(1);
    transition: .3s ease-in-out;
}
#blog a:hover .thum img{transform: scale(1.1);}
#blog a {text-decoration: none; color:#000;}
#cont #blog h2 { font-size: 22px; line-height: 1.2; margin: 0 0 .2em 0; padding: 0;}
#blog p { font-size: 14px; line-height: 1.6;}

.cap2 { border: solid 1px #000; padding: .3em 1em; margin-bottom: 1em; display: block;}
.cap3 { border-bottom: dotted 1px #2f4e3e; padding: 0 0 .3em 0; margin-bottom: 1em; display: block;}

.wp-block-image.is-style-rounded img,.wp-block-image .is-style-rounded img{
    border-radius: 10px;
}
.wp-block-embed__wrapper {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.wp-block-embed__wrapper iframe {
 width: 100%;
 height: 100%;
}

iframe {
  vertical-align: bottom;
}
iframe {
  display: block;
}


blockquote {
    clear: both;
    padding: 10px 0 10px 15px;
    margin: 10px 0 25px 30px;
    border-left: 5px solid #ccc;
}

blockquote p {
    padding: 5px 0;
}

table {
    border: 1px #dddddd solid;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

table th {
    padding: 1em;
    border: 1px #dddddd solid;
    border-width: 0 0 1px 1px;
    font-weight: normal;
    background: #f2f2f2;
    vertical-align: middle;
}

table th:first-child {
	width: 30%;
}

table th span {
    color: red;
}

table td {
    padding: 1em;
    border: 1px #dddddd solid;
    border-width: 0 0 1px 1px;
    background: #fff;
    vertical-align: middle;
}

table td.txc {
	text-align: center;
}

table p {
    margin: 0;
    padding: 0;
}

table.tb {
    border: 1px #dddddd solid;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

table.tb th {
    padding: 1em;
    border: 1px #dddddd solid;
    border-width: 0 0 1px 1px;
    font-weight: normal;
    background: #f2f2f2;
    vertical-align: middle;
}

table.tb th:first-child {
  width: 30%;
}

table.tb th span {
    color: red;
}

table.tb td {
    padding: 1em;
    border: 1px #dddddd solid;
    border-width: 0 0 1px 1px;
    background: #fff;
    vertical-align: middle;
}

table.tb td.txc {
  text-align: center;
}

table.tb p {
    margin: 0;
    padding: 0;
}

#content table.has-fixed-layout {margin: 0;}
#content .wp-block-table table th { background: #5f5f5f; color: #fff; border: solid 1px #fff; }
#content .wp-block-table thead { border-bottom: none; }
#content .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background: #f4f3ef;
}
.wp-block-table td { background: none; }

dl {
    margin: 0;
}

dt {
    font-weight: bold;
}

dd {
    padding-bottom: 10px;
}

img {
    max-width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

img.aligncenter {
    display: block;
    margin: 0 auto 1em auto;
}

img.alignright {
    margin: 0 0 1em 1em;
    display: inline;
}

img.alignleft {
    margin: 0 1em 1em 0;
}

.alignright {
	margin: 0 0 1em 1em;
    float: right;
}

.alignleft {
	margin: 0 1em 1em 0;
    float: left;
}

.red {
    color: #ff0000;
}

.shadow {
	box-shadow: 0 0 15px 0 rgba(0,  0,  0, 0.13);
}

@media only screen and (max-width: 1000px) {
   #content {width: 85%; }
   #contB h3 { font-size: 28px;  }
   #Bbt a { font-size:22px; padding: 1em 1em;}
   #blog section { flex-basis: 48%; margin: 1%;}
   #blog .thum {
       max-width: 100%;
       height: 130px;
       overflow: hidden;
       margin-bottom: .5em;
   }
}



@media only screen and (max-width: 900px) {
#contB { padding: 5em 0;}
#contB-inner {display: block; padding: 0 0 1em 0; text-align: center;}
 #contB h3 { font-size: 28px; text-align: center; }
 #news h2 { font-size: 30px; margin: 0; padding: 0;}
 #contD h2 { font-size: 30px; margin: 0; padding: 0;}
 #contD-inner {display: block;}
 #news-inner { display: block; }
.col1 { flex-basis: 40%;}
.cor1 { flex-basis: 55%;}
.col2 { flex-basis: 40%;}
.cor2 { flex-basis: 55%;}

#cont h1 { font-size:30px;}
#cont h2 { font-size:24px;}
#cont h3 { font-size:25px;}
#cont h4 { font-size:20px;}
#cont h5 { font-size:18px;}
#cont h6 { font-size:16px;}
#cont #blog h2 { font-size:20px;}
#contF-inner {width: 60%;}
#contF section { flex-basis: 45%; margin: 2%; text-align: center; line-height: 1.4;}
#contC { width: 80%; display: block;}
#contC section { margin: 0 0 3em 0;}
}



@media only screen and (max-width: 800px) {
.mcopy { font-size: 34px; font-weight: bold; line-height: 1.4; color: #fff; text-shadow: 0 0 10px #000000;}
.subcopy { font-size: 14px; font-weight: bold; color: #fff; text-shadow: 0 0 10px #000000;}

}
@media only screen and (max-width: 700px) {
  #contB h3 { font-size: 24px; text-align: left; }
  #contA #lead { font-size: 16px; text-align: left;}
   #slcopy { top:15%;}
   .br-sp {display: none;}
   .subcopy { display: block; width: 80%; line-height: 1.6; margin: auto; }
   #whats { display: block;}
   .col1,.col2,.col3,.col4  { width: 100%; height: 200px;}
   .cor1,.cor2,.cor3,.cor4  { padding: 2em 0 0 0;}
   #ad { display: block;text-align: center;}
   #ad section {line-height: 1.3; font-size: 14px;}
   #ad section:first-of-type {font-size: 16px; font-weight: bold; line-height: 1.4; border-right: none; padding-right:0; margin-right: 0;}
   #blog section { flex-basis: 100%; margin: 1% 0;}
   #blog .thum {
       height: 180px;
   }
   #contF-inner {width: 95%;}
}
@media only screen and (max-width: 644px) {
   body { font-size: 14px; line-height: 1.7;}
   #slcopy { top:19%;}
.mcopy { font-size: 20px; font-weight: bold; color: #fff; text-shadow: 0 0 10px #000000;}
.subcopy { font-size: 11px; font-weight: bold; color: #fff; text-shadow: 0 0 10px #000000;}
#ken a { font-size: 11px; border: solid 1px #ff5a00;  padding: .2em 1.5em; margin-top: .5em; }
#contA { padding: 2em 0;}
#contA h1,#contA h2 { font-size: 18px; text-align: left;}
#lead-b h2 {  font-size: 26px; text-align: left;}
#lead-b h3 { font-size: 19px;}
#whats h3 { font-size: 22px;}
#contF h2 { font-size: 28px; text-align: center;}
#footer-inner { padding:6em 0 10em 0; }
#flogo { font-size: 24px; }
#spl { font-size: 8px;}
#cont { padding: 1em 0 3em 0;}
#cont h1,#cont h2,#cont h3,#cont h4,#cont h5,#cont h6,#cont h1.cap {line-height: 1.2;}
#cont h1 { font-size:27px;}
#cont h2 { font-size:22px;}
#cont h3 { font-size:20px;}
#cont h4 { font-size:18px;}
#cont h5 { font-size:17px;}
#cont h6 { font-size:15px;}
#contG h2 { font-size: 20px;line-height: 1.4;}
#contG h3 { font-size: 18px;line-height: 1.4; }
#contG h4 { font-size: 16px; line-height: 1.4;}
#contG h5 { font-size: 16px; margin-left: 0; margin-bottom: 1em;}
#contG h4::before {content: ''; color: #2f4e3e; padding-right: 0em;}
#contG li { display: block; background: #a4684b; padding: .3em 1em; border-radius: 3em; font-size: 14px; font-weight: bold; color: #fff; margin: 1%; text-align: center;}
#contG dl { font-size: 12px; margin: 0 0 3em 0; font-weight: bold;}
#contG dt { padding: .5em 0 .5em 1em;}
#contG dd { margin: -2.7em 0 0 0; padding: .5em 0 .5em 10em; border-bottom: solid 1px #eed;}
#contG dl dd.odd { background-color: #eed;}
#contG dl dd.even { background-color: #fff;}
.date { margin-bottom: .8em;}
.subsns { flex-basis: 30%;}
.side-menu {
    position: fixed;
    top: inherit;
    bottom: 1.5em;
    right: 0;
    left: 0;
    z-index: 101;
    font-size: 0;
}
.side-menu ul {
    margin: 0;
    padding: 0;
    display: flex;
}
.side-menu li {
    margin: 0;
    float: none;
    display: block;
    flex: 1;
}
.side-menu li a {
    -webkit-writing-mode: inherit;
    -ms-writing-mode: inherit;
    writing-mode: inherit;
    width: auto;
    display: block;
    font-size: 14px;
    font-weight: bold;
    padding: 1.5em 0;
    text-decoration: none;
    text-align: center;
    color: #fff;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}
.side-menu li:first-of-type a{ border-right: solid 1px #fff;}
.side-menu li:last-of-type a {border-right: solid 1px #7e4e23;}
.alignright {
	margin: 0 0 1em 0;
    float: none;
}

.alignleft {
	margin: 0 0 1em 0;
    float: none;
}
#cont .wp-block-image .alignright {
    float: none;
    margin: 0 0 .5em 0;
    display: block;
}
#cont .wp-block-image .alignleft {
    float: none;
    margin: 0 0 .5em 0;
    display: block;
}
    span.wpcf7-list-item {
        display: block;
        padding: .6em 0;
    }
    textarea {
        height: auto;
        line-height: 1.5;
        width: 70%;
    }
    input[type="text"],
    textarea {
        width: 70%;
    }
    input[type="tel"],
    textarea {
        width: 70%;
    }
    input[type="email"],
    textarea {
        width: 70%;
    }
    input[type="url"],
    textarea {
        width: 70%;
    }
}