/*

1. Add your custom Css styles below
2. Place the this code in your template:
<link href="css/custom.css" rel="stylesheet">

*/


.bold {
font-weight: bold;
}

a:not(.btn):hover, a:not(.btn):focus, a:not(.btn):active {
text-decoration: none;
outline: none;
color: #66a20a;
}

.btn:not(:disabled):not(.disabled):active {
border-color: #66a20a;
background-color: #66a20a;
}

@media screen and (max-width:480px) {
br.pc {
display: none;
}
}

@media screen and (min-width:480px) {
br.mobile {
display: none;
}
}

#header #mainMenu-trigger {
top:4px;
}

.heading-text.heading-section > h2:before {
content: "";
position: absolute;
height: 2px;
width: 100px;
background-color: #b3cf38;
bottom: -30px;
left: 0;
right: 0;
}

#header .header-inner #logo a > img, #header #header-wrap #logo a > img {
vertical-align: inherit;
transition: all .4s ease-in-out;
height: 24px;
width: auto;
margin: -5px auto;
}

@media screen and (max-width:480px) {
#header .header-inner #logo a > img, #header #header-wrap #logo a > img {
vertical-align: inherit;
transition: all .4s ease-in-out;
height: 20px;
width: auto;
margin: -2px auto;
}
}

.inspiro-slider .slide-captions > p {
color: #fff;
font-size: 18px;
font-weight: 600;
line-height: 180%;
margin-bottom: 40px; }

@media screen and (max-width:480px) {
.inspiro-slider .slide-captions > p {
color: #fff;
font-size: 14px;
font-weight: 600;
line-height: 180%;
margin-bottom: 40px;
}
}

.lead {
font-size: 1.2em;
line-height: 1.8em;
}

.grid-image {
margin-bottom: 10px;
}

/* ホバー時とタップ時のエフェクトを無効化 */
.grid-image {
  cursor: default !important;
}

.grid-image:after,
.grid-image:hover:after {
  display: none !important;
}

.grid-image img,
.grid-image:hover img,
.grid-image:active img {
  transition: none !important;
  transform: none !important;
  cursor: default !important;
}

/* センタリング用のユーティリティクラス */
.center {
  text-align: center;
}

.heading-text.heading-section > h2 {
font-weight: bold
}

h3 {
font-weight: bold
}

.call-to-action {
position: relative;
overflow: hidden;
padding: 130px 50px 34px;
}

.v-align-top {
vertical-align: top;
}


.mobile p {
font-size: 1em;
font-style: normal;
font-weight: 400;
text-transform: none;
line-height: 1.8;
letter-spacing: 0;
color: #565656;
font-family: "Open Sans", "Helvetica", "Arial", sans-serif;
}

.accordion .ac-item .ac-title {
font-size: 15px;
}

img.img-dlapp {
width:100%;
}

@media screen and (max-width:480px) {
img.img-dlapp {
width: 60%;
margin-left: 20%;
}
}

.lazyload{
opacity: 0;
}

.lazyloaded{
opacity: 1;
animation: fadeIn 1s ease 0s 1 normal;
-webkit-animation: fadeIn 1s ease 0s 1 normal;
}


@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}


/*** News ***/
section #news {
padding: 0;
}


.newsSection {
padding: 40px 0 20px;
}

.newsSection .container {
border-bottom: 1px solid #ececec;
}

#news li {
padding: 0;
list-style-type: none;
margin:15px 0 0 0;
}

#news h5 span {
display: inline-block;
color: #565656;
}

#news h5 time {
display: inline-block;
margin-right: 2em;
padding: 0;
padding-right: 1em;
width: 70px;
color: #565656;
}

#news h5::before {
font-size: 18px;
content: "\e9db";
font-family: "inspiro-icons";
right: 0;
position: absolute;
}

#news .open h5::before {
content: "\e9c0";
}

#news .desc {
display: none;
font-size: 1.1em;
line-height: 1.8em;
padding: 20px 25px;
margin:10px 0 15px;
background-color: #FFF;
border-radius: 6px;
border: 1px solid #ececec;
color: #565656;
font-weight: 500;
}

#news section,
#news .ac-item {
padding: 0;
}

.heading-text h3.news {
margin-bottom: 0;
}
/*** End: News ***/

.header-logo-center #logo, .menu-split #logo {
position: relative!important;
}

.dynamic_link_QR {
background-color: #FFF;
border-radius: 10px;
width: 150px;
height: 150px;
padding: 15px;
margin: 0 auto;
box-shadow: 0px 8px 16px -5px #d8d8d8;
border:1px solid #eeeeee;
position:relative;
z-index: 2;
}

.inspiro-slider .slide-captions .dynamic_link_QR img{
width: 120px!important;
}

.dynamic_link {
max-width: 400px;
min-height: 400px;
margin: 0 auto;
line-height: 1.5;
background-color: #FFF;
padding: 50px;
color: #565656!important;
margin:-70px auto 0;
border-radius: 10px;
box-shadow:0px 8px 16px -5px #545454;
position:relative;
z-index: 1;
}

.inspiro-slider .slide-captions .dynamic_link .QR_lead {
margin: 40px 0 5px;
font-weight: bold;
font-size: 1.2em
}

.inspiro-slider .slide-captions .dynamic_link img {
width: 100%!important;
margin: 0 0 20px;
}


.dynamic_link i{
color: #b6e40e!important;
font-size: 80px;
margin: 100px 0 20px;
}

.dynamic_link h2{
color: #3e3e3e!important;
font-size: 32px!important;
line-height: 1.3!important;
margin-bottom: 10px!important;
}

.dynamic_link p{
color: #565656!important;
font-size: 15px;
}

.dynamic_link span{
display: block;
margin:20px 0 0;
background-color: #404040;
border-radius: 60px;
padding: 10px;
font-size: 20px;
font-weight: bold;
}

.col-lg-4 {
	margin-bottom: 30px;
}