@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
body {
  min-width: 1256px;
  background-color: #fff;
  letter-spacing: .1em;
}
p, .mail, .item,.btn_more {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

#header-container, #header-container .navi, #navi .navi-in>.menu-header .sub-menu, #footer {
  background-color: #fff;
}

.header, .header .site-name-text, #navi .navi-in a, #navi .navi-in a:hover,  #footer, #footer a {
  color: #293862;
}
.entry-title, .archive-title {
  font-size: 60px;
  color: #263862;
  margin: 80px 0;
}
.home .content-in.wrap {
    width: auto;
}

.home .entry-content > div {
    width: 1256px;
    margin: 200px auto;
}
.home h3 {
    border: none;
    font-weight: normal;
    padding: 12px 0;
}
.home main.main {
    padding: 20px 0;
}

div#sidebar {
    width: 376px;
    border: 1px solid transparent;
    padding: 19px;
    border-radius: 4px;
    background-color: #fff;
}

main.main {
    width: 860px;
    padding: 20px 29px;
    border: 1px solid transparent;
    border-radius: 4px;
    position: relative;
}

.wrap {
    width: 1256px;
    margin: 0 auto;
}

.content-in {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
}
.article h3 {
  font-size: 32px;
}

.single header {
  margin-bottom: 50px;
}

/** header **/


div#header-container-in {
  border-bottom: 4px solid #263862;
}

.logo-header {
  width: 50%;
  text-align: left;
}

.contact-wrap {
  width: 50%;
  display: flex;
}

.header-in {
  flex-direction: row;
  margin-top: 100px;
}
.logo-image {
    padding: 0;
}
.underline {
  border-bottom: 1px solid #333;
}

.tel {
  font-size: 68px;
  color: #263862;
  letter-spacing: .05em;
  line-height: 1.5;
  background: url(./img/tel.png) no-repeat left center;
  padding-left: 50px;
}

.contact-tel .tel {
  font-size: 40px;
  padding-left: 32px;
  letter-spacing: .05em;
  background-size: 25px;
}

.contact-tel p span {
  font-size: 15px;
  letter-spacing: 0;
}

.contact-tel {
    margin-right: 40px;
}

.contact-mail .mail {padding: 25px 50px 25px 75px;margin-top: 8px;display: block;background-size: 26px;background-position: 40px 31px;}

.mail {
    color: #fff;
    background: url(./img/mail.png) no-repeat left center;
    background-color: #263862;
    border-radius: 8px;
    text-decoration: none;
}

a.mail:hover {
  color: #fff;
  background-color: #5C6A99
}
#navi .navi-in a:hover, #footer a:hover {
    background-color: #263862;
    color: #fff;
}

#header {
  margin-bottom: 60px;
}

.main-v {
  background: url(./img/main_v.png) no-repeat center;
  background-size: cover;
  color: #fff;
  min-height: 733px;
  height: 50vw;
}

.main-v div {padding: 13% 11% 0;}

.main-v h1 {
    font-size: 68px;
    letter-spacing: 0.15em;
    line-height: 1.2;
    margin-bottom: 60px;
    font-weight: normal;
}

.main-v p {
    font-size: 30px;
}






.page .article h2,.sub-tit {
  text-align: center;
  color: #293862;
  background: none;
  font-weight: normal;
  font-size: 70px;
  margin-bottom: 55px;
}

.top-box01 {
  text-align: center;
}


.top-box01 p {
    font-size: 22px;
}
.content-menu01 {
    background: url(./img/menu_icon01.png) no-repeat center top 30px;
}
.content-menu02 {
    background: url(./img/menu_icon02.png) no-repeat center top 30px;
}
.content-menu03 {
    background: url(./img/menu_icon03.png) no-repeat center top 50px;
}
.content-menu04 {
    background: url(./img/menu_icon04.png) no-repeat center top 30px;
}
.top-box02 div {
    width: 23%;
    text-align: center;
    background-color: #263862;
    padding: 30px;
    color: #fff;
    position: relative;
}

.top-box02 {
    display: flex;
    justify-content: space-between;
    margin-top: 298px;
}


.top-box02 h3 {
    margin-top: 125px;
    font-size: 38px;
}
.top-box02 a {
    position: absolute;
    bottom: 15px;
    right: 20px;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    line-height: 1;
}

.top-box02 a::after{
  content:">";
  font-size: 22px;
  margin-left: 20px;
}

.top-box02 a:hover{
  border-bottom: 1px #fff solid;
}



.page .article .top-tit {
    font-size: 120px;
}

.page .article .top-tit span {
    font-size: 20px;
    display: block;
}

.news-box .item {display: flex;padding: 40px 0;border-bottom: 1px solid #333;}
.news-box .item:nth-child(1){
  border-top: 1px solid #333;
}
.cat-data {
    display: flex;
}

.home .category a {
    color: #fff;
    text-decoration: none;
}

.home .category {
    background-color: #263862;
    min-width: 188px;
    padding: 15px;
    text-align: center;
}

.time {
    padding: 15px 25px;
}



.title {
    padding: 15px;
}

.title a {
    color: #333;
}

.title a:hover {
    opacity: 0.7;
    text-decoration: none;
}
.home .category:hover {
    opacity: 0.7;
}



.btn_more {
    text-align: center;
    margin-top: 130px;
}

.btn_more a {
    color: #333;
    border: 1px solid #333;
    text-decoration: none;
    padding: 40px 200px;
    background-color: #fff;
}

.btn_more a:hover {
    background-color: #263862;
    color: #fff;
}

.top-box04 .contact-wrap {
    width: 100%;
    margin-bottom: 40px;
}

.top-box04 {
    padding: 40px 80px;
    border: 1px solid #333;
    text-align: center;
}

.page .article .top-box04 h2 {
    margin: 0;
}

.top-box04 .mail {
    margin-left: 40px;
    display: block;
    width: 515px;
    background-position-x: 165px;
    padding: 18px;
}

.top-box04 .tel {
    line-height: 1;
}



.top-box05 h3 {
    margin-top: 185px;
    text-align: center;
    font-size: 27px;
    color: #263862;
}
.flow-wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 140px;
}

.flow-wrap div {
    width: 17%;
    padding: 20px;
    position: relative;
    background-color: #F0F0F0;
}
.flow-wrap div:before{
  position: absolute;
  top: -65px;
  left: 50%;
  font-size: 72px;
  color: #263862;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  transform: translate(-50%);
}
.flow01:before{
    content: "01";
}
.flow02:before{
    content: "02";
}
.flow03:before{
    content: "03";
}
.flow04:before{
    content: "04";
}
.flow05:before{
    content: "05";
}

.flow-wrap div:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -15px;
  border: 44px solid transparent;
  border-left: 25px solid #263862;
}
.flow05:after {
  content: "";
  display: none;
}

.flow01 {
    background: url(./img/flow_icon01.png) no-repeat center top 80px;
}

.flow02 {
    background: url(./img/flow_icon02.png) no-repeat center top 80px;
}
.flow03 {
    background: url(./img/flow_icon03.png) no-repeat center top 80px;
}
.flow04 {
    background: url(./img/flow_icon04.png) no-repeat center top 60px;
}
.flow05 {
    background: url(./img/flow_icon05.png) no-repeat center top 60px;
}



.home .entry-content > .top-box06 {
    width: 100%;
    background-color: #F0F0F0;
    padding: 80px 0 190px;
    margin: 200px auto 100px;
}

.voice-box {
    width: 1256px;
    margin: 80px auto;
    text-align: center;
    display: flex;
    justify-content: space-between;
}
.voice-box .item {
    width: 31%;
}




.about-wrap {
    display: flex;
}

.page .article .top-box06 h2 {
    margin-top: 10px;
}

.page .article .top-box07 h2 {
    margin: 100px;
}

.home .entry-content > .top-box07 {
    margin: 120px auto;
}

.about-wrap img {
    margin-right: 60px;
}

.about-r h3 {
    margin: 0;
    font-size: 48px;
    color: #263862;
    margin-bottom: 50px;
}

p.about-name {
    font-size: 32px;
    margin: 0 0 30px;
}

p.about-name span {
    font-size: 18px;
    margin-left: 40px;
}



.link-wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 120px;
}

.link-wrap > a {
    width: 32%;
    border: 1px solid #333;
    border-radius: 4px;
    padding: 25px 25px 25px 53px;
    position: relative;
    background: url(./img/link_ar.png) no-repeat left 25px top 28px;
    text-decoration: none;
    color: #333;
}
.link-wrap > a:hover {opacity: 0.6;}

.link-wrap > a div h3 {
    margin: 0;
    padding: 0;
}

.link-wrap > a div p {
    margin: 0;
}

.link01:after {
    content:"";
    background: url(./img/link01.png) no-repeat;
    position: absolute;
    bottom: -1px;
    right: 20px;
    width: 100px;
    height: 150px;
}
.link02:after {
    content:"";
    background: url(./img/link02.png) no-repeat;
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 162px;
    height: 128px;
}
.link03:after {
    content:"";
    background: url(./img/link03.png) no-repeat;
    position: absolute;
    bottom: -30px;
    right: -10px;
    width: 140px;
    height: 169px;
}


.home .entry-content > .top-box09 {
    background: url(./img/soudan.jpg) no-repeat center top -85px;
    background-size: cover;
    width: 100%;
    min-width: 1256px;
    height: 650px;
    margin-bottom: 0;
}

.home .entry-content > .top-box10 {
    margin: 0;
    background-color: #263862;
    color: #fff;
    min-width: 1256px;
    width: 100%;
    text-align: center;
    padding-bottom: 100px;
}

.page .article .top-box10 h2 {
    margin-top: 0;
    padding-top: 120px;
    color: #fff;
}

.access-wrap {
    display: flex;
    justify-content: space-between;
    width: 800px;
    margin: 100px auto;
    background-color: #fff;
    border-radius: 8px;
    padding: 25px;
}

.access-wrap .tel {
    font-size: 54px;
    text-align: left;
    background-position-y: 9px;
    background-size: 30px;
    padding-left: 45px;
    line-height: 1;
}

.access-wrap .tel p {
    font-size: 18px;
    padding-top: 10px;
    margin-left: -45px;
    margin-bottom: 0;
}

.access-wrap .mail {
    display: block;
    width: 260px;
    padding: 25px 25px 25px 60px;
    background-position-x: 60px;
}

.top-box10 iframe {
    margin-bottom: 50px;
}
/** footer **/

.footer {
  padding: 0;
}

.footer-bottom {
  padding: 0;
}

.footer-bottom.fdt-up-and-down .footer-bottom-logo {
  display: block;
  float: none;
  position: static;
  margin-top: 100px;
}

.footer-bottom-logo img {
  height: auto;
}

.footer-bottom.fnm-text-width .menu-footer li {
  width: 182px;
  padding: 10px;
  display: block;
  flex: none;
  border-left: 1px solid #333;
}
.navi-footer-in > .menu-footer li:last-child {
    border-right: 1px solid #333;
}

#navi-footer {
  margin: 70px 0 50px;
}
#footer .logo-image a:hover {
  background: #fff;
}

.copyright {
  padding: 40px;
  background-color: #EFEFEF;
  margin-top: 100px;
}


/** post **/
.eye-catch .cat-label {
  display: none;
}
.fa {
  font-size: 20px;
}

time {
  font-size: 20px;
}

.cat-link {
  font-size: 20px;
}

footer.article-footer.entry-footer {
  display: none;
}

.eye-catch-wrap {
  justify-content: center;
}


h1 .fa {
    font-size: 60px;
}

.cat-label {
    font-size: 18px;
}

.entry-card-title, .related-entry-card-title {
    font-size: 24px;
}

.entry-card-snippet, .related-entry-card-snippet {
    font-size: 18px;
}
.entry-card-info > * {
    font-size: 18px;
}
.breadcrumb-caption {
  font-size: 20px;
}



/** contact **/
h3.privacy-tit {
  border: none;
  padding: 0;
}

p.privacy-text {
  padding: 30px;
  border: 1px solid #333;
}

.acceptance-105 {
  font-size: 30px;
  text-align: center;
  display: block;
}

.acceptance-105 input[type="checkbox"] {width: 20px;height: 20px;-moz-transform:  scale(1.4);-webkit-transform: scale(1.4);transform:  scale(1.4);}

.wpcf7-submit {
  font-size: 26px;
}

.contact-tit {
  font-size: 26px;
  font-weight: bold;
  line-height: 1;
  width: 30%;
  margin-top: 15px;
}

.contact-tit span {
  color: red;
  border: 1px solid red;
  padding: 2px 10px;
  margin-left: 10px;
  font-size: 20px;
}

.wpcf7 form > div {
  display: flex;
  margin: 50px 0;
}

input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea,.contact-r select {
  font-size: 24px;
  padding: 20px;
  margin-bottom: 20px;
}

.contact-r {
  width: 70%;
}
.name-1 input[type="text"], .name-2 input[type="text"],.name-3 input[type="text"], .name-4 input[type="text"] {
  width: 45%;
  float: left;
  margin: 0 20px;
}

.name-2 input[type="text"],.name-4 input[type="text"] {
  margin-top: -31px;
}

/** about **/
.article h3.about-tit {
  border: none;
  margin-top: 0;
  padding: 0;
  width: 20%;
  font-size: 24px;
}

.about-box {
  display: flex;
  margin-bottom: 40px;
}

p.about-text {width: 80%;font-size: 22px;}
figcaption {
    font-size: 18px;
}
#post-21 .wp-block-media-text__content {
  padding: 0 50px 0 0;
}
#post-21 .wp-block-media-text__content p {
  text-align: justify;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/

  .navi-in > .menu-header {
    display: flex;
}

}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
