@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.1.1
*/


/************************************
** 子テーマ用のスタイルを書く
************************************/


a {
  color: #8080FF;
  text-decoration: none;
}
a:hover {
  color: #FF8080;
}


.container,
.header-container,
.wrap {
  width: 100%;
}
.header-container {
  position: fixed;
  top: 0;
  z-index: 1;
  box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1);
}
.header-container-in {
  display: flex;
  align-items: center;
}
.header {
  width: 25%;
}
.logo-image {
  padding: 0;
  width: 60%;
  margin-left: 40%;
}
.logo-image img {
  margin-bottom: -10px;
}
.logo-image:hover {
  opacity: .6;
  transition: all 0.3s ease-in-out;
}
.navi {
  width: 75%;
}
.tagline {
  display: none;
}
.content {
  margin-top: 84px;
}

.navi-in a:hover {
  background-color: #F2F2FF;
  transition: all 0.3s ease-in-out;
  text-decoration: none;
  color: #8080FF;
}
.navi-in > ul li {
  display: block;
  width: 176px;
  height: 60px;
  line-height: 60px;
  margin-left: 12px;
}
.navi-in > ul li.contact {
  height: 40px;
  line-height: 40px;
  margin-top: 10px;
}
.navi-in > ul li.contact a {
  background-color: #8080FF;
  color: #fff;
  border-radius: 4px;
}
.navi-in > ul li.contact a:hover {
  background-color: #fff;
  color: #8080FF;
}
.navi-in > ul li ul li {
  margin-left: 0;
}
.menu-header .current-menu-item,
.menu-header .current-menu-parent {
  position: relative;
}
.menu-header .current-menu-item:after,
.menu-header .current-menu-parent:after {
  position: absolute;
  content: '';
  height: 2px;
  bottom: 0;
  background-color: #8080FF;
  width: 100%;
  left: 0;
}
.menu-header .sub-menu .current-menu-item:after {
  background-color: #fafbfc;
}
.menu-header .contact.current-menu-item:after {
  background-color: rgba(255, 255, 255, 0);
}



.footer-bottom.fnm-text-width .menu-footer li a {
  font-size: 12px;
  padding: 6px 10px;
}
.navi-footer-in a:hover {
  background-color: #F2F2FF;
  transition: all 0.3s ease-in-out;
  text-decoration: none;
}
.navi-footer-in > .menu-footer li {
  border: none;
}
.navi-footer-in > .menu-footer li:last-child {
  border: none;
}
.navi-footer-in a {
  font-size: 18px;
}
.mobile-menu-buttons .menu-caption {
  font-size: 14px;
}
.footer-bottom-logo img {
  height: auto;
}
.mobile-menu-buttons {
  font-size: 24px;
}
.menu-drawer .sub-menu {
  margin: 0;
}
.navi-menu-content {
  background-color: #f5f5f5;
}
.menu-content .fa-times:before {
  content: 'x';
  font-weight: normal;
  color: #999;
}
.menu-drawer li {
  margin: 8px 0 8px 12px;
  font-size: .8em;
}
.menu-drawer li li {
  margin: 8px 0;
  font-size: 1em;
}
.home .home-menu-button a span,
.current-menu-item a span,
.current-page-ancestor a span {
  color: #8080FF;
}
.page .date-tags {
  display: none;
}
.go-to-top {
  right: 30px;
  bottom: 60px;
}
.new-entry-card-thumb {
  display: none;
}
.widget-entry-card-content {
  margin-left: 0;
}
.new-entry-card-date {
  display: block;
  color: #333;
}
.new-entry-card-update-date {
  display: none;
}
.new-entry-card-content {
  position: relative;
  height: 48px;
}
.new-entry-card-title {
  position: absolute;
  top: 24px;
  font-size: 18px;
}
.new-entry-card-date .post-date {
  padding: 0;
  font-size: 1em;
  letter-spacing: 1px;
  font-weight: bold;
  position: absolute;
  top: 0;
}
.entry-card-thumb {
  display: none;
}
.entry-card-content {
  margin-left: 10px;
}
.content-in {
  padding-top: 24px;
}
.main {
  width: 70%;
  padding-left: 5%;
}
.sidebar {
  width: 30%;
  padding-right: 5%;
}
.entry-content {
  margin-top: 72px;
}
.a-wrap {
  color: #8080FF;
}
.a-wrap:hover {
  background-color: #f5f8fa;
  transition: all 0.3s ease-in-out;
  color: #333;
}
.ect-entry-card .a-wrap {
  color: #333;
}
.article h3 {
  border: none;
  font-size: 20px;
  padding: 12px 0;
}


.grecaptcha-badge {
	visibility: hidden;
}
.wpcf7 label.required {
  color: #8080FF;
}
.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select {
  -webkit-appearance: none;
}
.wpcf7 label.required input,
.wpcf7 label.required textarea,
.wpcf7 label.required select {
  border: 1px solid #8080FF;
}
.wpcf7 input[type='submit'] {
  -webkit-appearance: none;
  border: 1px solid #8080FF;
  background-color: #8080FF;
  color: #fff;
  border-radius: 4px;
  font-size: 18px;
  letter-spacing: 4px;
  margin-top: 36px;
}
.wpcf7 ::-webkit-input-placeholder {
  color: #bbb;
}
.wpcf7 ::-moz-placeholder {
  color: #bbb;
}
.wpcf7 .contact-form-check {
  color: #8080FF;
}
.wpcf7 .contact-form-check .checkbox-check {
  color: #333;
}
.footer-bottom {
  margin-bottom: 48px;
}

/*------ Contact form 7 checkbox ------*/
.wpcf7 input[type="checkbox"],
.wpcf7 input[type="radio"] {
  display: none;
}
.wpcf7 label{
  cursor: pointer;
}
.wpcf7-list-item-label {
  position: relative;
  padding-left: 28px;
}
.wpcf7-checkbox .wpcf7-list-item-label:before{
  width: 16px;
  height: 16px;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  border: 1.5px solid #bbb;
  border-radius: 4px;
}
.wpcf7-checkbox .wpcf7-list-item-label:after{
    width: 16px;
    height: 8px;
    border: 2px solid #8080FF;
    content: '';
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 4px;
    top: 0px;
    border-top: none;
    border-right: none;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}
.wpcf7-radio .wpcf7-list-item-label:before{
  width: 16px;
  height: 16px;
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  border: 1.5px solid #bbb;
  border-radius: 10px;
}
.wpcf7-radio .wpcf7-list-item-label:after{
    width: 8px;
    height: 8px;
	border-radius: 10px;
    background-color: #8080FF;
    content: '';
    position: absolute;
    left: 5px;
    top: 5px;
    border-top: none;
    border-right: none;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}
.wpcf7 input[type="checkbox"]:checked + .wpcf7-list-item-label:after,
.wpcf7 input[type="radio"]:checked + .wpcf7-list-item-label:after {
    opacity: 1;
}
span.wpcf7-list-item{
  margin-left: 0!important;
  margin-right: 30px!important;
}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
}

/*834px以下*/
@media screen and (max-width: 834px){
  .navi-footer-in > .menu-footer li.menu-item {
    text-align: left;
  }
  .footer {
    padding-bottom: 60px;
  }
  table th,
  table td {
    font-size: 1em;
  }
  .header-container-in {
    display: block;
  }
  .header {
    width: 100%;
  }
  .logo-image {
    padding: 15px 0 0;
    width: 60%;
    margin: auto;
  }
  .logo-image img {
    margin-bottom: 0;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  .entry-title {
    padding-left: 0;
  }
  .footer-bottom {
    margin-bottom: 0;
  }
}