@charset "utf-8";
/* -------------------------------------------------------
/* CSS Document by Rakus https://form.keiriplus.jp/
/* for HubSpot Form .
/*   common portalId: '2263214' 
/* -------------------------------------------------------*/

/*共通デザイン設定________________________________________*/
/* *{
font-family: "Noto Sans CJK JP", "Noto Sans JP", "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
} */
#wrapper{
position: relative;
}
header,section,footer{
width: 100%;
}
.content{
width: 100%;
max-width: 1104px;
margin: 0 auto;
padding:0 2.5rem;
}
a{
transition: all 0.15s ease !important;
}
a:hover{
opacity: 0.65;
}
/*header*/
header{
background: rgba(255,255,255,0.85);
position: fixed;
top: 0;
z-index: 10;
padding: 0.625rem 0;
border-bottom: 1px solid #ccc;
}
header .content{
text-align: left;
}
header .content img{
width: 190px;
height: auto;
}
/*//header*/

/*#title-block*/
section#title-block{
background: #0179c5; 
margin-top: 68px;
position: relative;
}
section#title-block h2{
font-size: 2rem;
padding: 1rem 0;
text-align: justify;
letter-spacing: 0.2rem;
color: #fff;
line-height: 1.3;
}

/*#breadcrumbs*/
ul#breadcrumbs{
font-size: 0.8rem;
width: 100%;
max-width: 1104px;
margin: 0.625rem auto 0 auto;
padding:0 2.5rem;
}
ul#breadcrumbs li{
display: inline-block;
position: relative;
}
ul#breadcrumbs li::after{
display: inline-block;
position: relative;
content: ">";
font-size: 0.75rem;
vertical-align: 0.05rem;
padding: 0 0 0 0.25rem;
}
ul#breadcrumbs li a{
color:#0d85d0;
}
ul#breadcrumbs li a:hover{
text-decoration: underline;
color:#0d85d0;
}
ul#breadcrumbs li:last-child a{
color:#666;
cursor:default;
}
ul#breadcrumbs li:last-child a:hover{
text-decoration: none;
}
ul#breadcrumbs li:last-child::after{
display: none;
}
/*//#breadcrumbs*/

/*#main-block*/
section#main-block{
position: relative;
padding: 2.125rem 1.25rem 2.5rem 1.25rem;
}
section#main-block .content{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-content: flex-start;
}
.item{
width:47%;
}
#form-item.item{
width:48%;
clear: both;
margin-left: auto;
margin-right: auto;
}
#form-item .form-item-wrap{
background: #f0f0f0;
}
#form-item .form-item-wrap .hbspt-form{
padding: 0.937rem;
}
.item h3{
text-align: justify;
margin: 0.937rem 0 0 0;
padding: 0 0 0.937rem 0;
font-size: 1.25rem;
line-height: 1.5;
color: #166596
}
.item h4{
text-align: center;
margin: 0.937rem auto;
padding: 0;
font-size: 1.225rem;
line-height: 1.5;
color: #166596;
}
.item p{
text-align:left;
margin: 0 0 0.937rem 0;
line-height: 1.5;
}

.item a{
color: #0179c5;
display: inline-block;
padding: 0 2px;
text-decoration: underline;
}
.item a.display-inline{
color: #0179c5;
display: inline;
padding: 0 2px;
}
.item a:hover{
color: #3aa7ea;
text-decoration: none;
}
.item .float-img{
display: block;
float: right;
max-width: 220px;
height: auto;
padding: 0 0 0.625rem 0.625rem;
}
.item .float-img.float-img-big{
max-width: 460px;
padding: 0 0 1.25rem 1.25rem;
}
.item-img{
width: 90%;
max-width: 640px;
margin: 10px auto;
display: block;
}
.item-ul-list {
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
padding: 0.625rem 3px;
margin: 0 auto 0.625rem auto;
}

.item-ul-list li{
text-align: justify;
padding: 2px 0;
line-height: 1.3;
position: relative;
}
.item-ul-list li::before{
content: "・";
position: relative;
display: inline-block;
padding-right: 3px;
color: #166596;
font-size: 120%;
font-weight: bold;
vertical-align: middle;
}
.item-ul-list.nolist-style li::before {
display: none;
}
.item-dl-list{
margin: 0 auto 20px auto;
border: 1px solid #edfcff;
padding: 20px;
border-radius: 5px;
background: #f0f0f0;
}
.item-dl-list dt{
font-size: 1.1rem;
color: #0179c5;
font-weight: bold;
margin: 10px auto 5px 1.2em;
position: relative;
}
.item-dl-list dt::before {
    content: '';
    position: absolute;
    width: 0.7em;
    height: 0.7em;
    border: .2em solid #0179c5;
    top: 1px;
    left: -1.2em;
    border-radius: 50%;
}
.item-dl-list dd{
margin-bottom: 10px;
line-height: 1.5;
}
.ico-time{
position: relative;
}
.ico-time::before {
    font-family: FontAwesome;
    content: "\f017";
    display: inline-block;
    padding-right: 0.25rem;
    color: #aaa;
}
.item .memo{
color: #c43671;
font-size: 85%;
}
.item .sub{
  text-indent: -1em;
  padding-left: 1em;
font-size: 85%;
}

/*1columnのデザインの場合*/
section#main-block.main-block-1column .content{
display: block;
}
section#main-block.main-block-1column .content+.content{
margin-top: 1em;
}
section#main-block.main-block-1column .content .item{
width: 100%;
}
section#main-block.main-block-1column .item h3{
text-align: center;
padding: 0 0 0.937rem 0;
margin: 0 auto 0.937rem auto;
font-size:1.625rem;
line-height: 1.5;
color: #166596;
border-bottom: 1px solid #166596;
}
/*個人情報取り扱いコンテンツ*/
.hs-attention-text{
margin: 0.5rem auto 0 auto;
padding: 0 1.25rem 0.937rem 1.25rem;
font-size: 0.937rem;
text-align: justify;
line-height: 1.3;
}
dl.plain-definition-list{
border: 1px solid #cbe3f2;
background: #e3f1f9;
padding: 10px;
margin: 10px auto;
border-radius: 2px;
}
dl.plain-definition-list dt{
border-bottom: 1px solid #cbe3f2;
padding:0 2px 2px 2px;
margin-bottom: 0.5rem;
}
ul.plain-list li{
list-style: disc inside;
font-size: 0.75rem;
margin-top: 3px;
}

/*//#main-block*/




/*.content-bnr-paperless (footer直上のtemplate配下のページのみ)*/
.content-bnr-paperless{
margin: 0 auto 40px auto;
width: 100%;
}
.content-bnr-paperless a:hover{
opacity: 0.8;
}
.content-bnr-paperless a{
display: block;
width: 100%;
max-width: 660px;
margin: 0 auto;
transition: 0.2s;
}
@media screen and (max-width:768px) {
  .content-bnr-paperless{
  width: 90%;
  margin: 0 auto 40px;
  }
  .content-bnr-paperless a img{
  display: inline-block;
  width: 100%;
  }
}
/*//.content-bnr-paperless (footer直上のtemplate配下のページのみ)*/

/*footer*/
footer{
position: relative;
background: #777777;
color: #fff;
padding: 2.5rem 0;
}
#nav-footer li{
line-height: 1.8;
position: relative;
font-size: 0.75rem;
}
#nav-footer li::before{
display: inline-block;
position: relative;
content: ">";
font-size: 0.5rem;
vertical-align: 0.05rem;
padding: 0 0.25rem 0 0 ;
color: #fff;
}
#nav-footer li a{
color: #fff;
}
#nav-footer li a:hover{
text-decoration: underline;
}
#nav-footer .nav-list-sub {
  padding: 0 0 0 10px;
}
#footer-logo{
text-align: right;
padding: 0.625rem 0 0 0;
}
.copyright{
padding-top: 0.625rem;
font-size:0.625rem;
line-height: 1;
color: #fff;
}
/*//footer*/
/*end //共通デザイン設定_____________________________*/

/*HubSpot（#form-item）デザイン設定________________________________________*/

/*for noscript*/
.btn__desc2 {
display: none !important;
}
.noscript_p {
font-size: 16px !important;
color: #E91E63;
}
/*for all*/
#form-item h4{
font-size: 1.125rem;
line-height: 1;
color: #fff;
background: #0179c5;
padding: 1rem 0;
text-align: center;
border-radius: 0.4rem 0.4rem 0 0;
letter-spacing: 0.1rem;
margin-top: 0;
}
#form-item h4.h4-present-title{
color: #353535;
background: #ffeb5d;
letter-spacing: 0.05rem;
font-weight: bold;
margin: 0 auto;
}
#form-item h4.h4-present-title img{
height: 1.5rem;
display: inline-block;
vertical-align: -0.2em;
width: auto;
margin-right: 0.2em;
}
.h4-present-title-color-red{
color: #ff2140;
}
#hbspt-form-wrap{
padding: 0.85rem 1.375rem 1.375rem 1.375rem;
border: 1px solid #ccc;
border-radius: 0 0 0.4rem 0.4rem;
background: #f5f5f5;
line-height: 1;
}
div.field,div.hs-form-field,fieldset{
width: 100%;
margin: 0 auto !important;
position: relative;
max-width: 800px !important;
}
fieldset.form-columns-2::after{
clear: both;
height: 0px;
position: relative;
content:"";
}
fieldset.form-columns-2 div.hs-form-field,fieldset.form-columns-2 div.field{
width: 50%;
float: left;
}
fieldset.form-columns-2 div.hs-form-field:first-child,fieldset.form-columns-2 div.field:first-child{
padding-right: 10px !important;
}
fieldset.form-columns-2 div.hs-form-field:last-child,fieldset.form-columns-2 div.field:last-child{
}
div.hs-form-field label{
width: 100%;
line-height: 1.5;
}
div.hs-form-field label span{
font-size: 0.937rem;
vertical-align: 0;
color: #345d75;
}
legend{
line-height: 1.3;
margin: 0 auto 2px auto;
font-size: 0.75rem;
color: #345d75;
/*display: none;*/
}
div.field div.input{
width: 100% !important;
}
.hs-input{
width: 100% !important;
}
input[type="text"],input[type="email"],input[type="tel"],input[type="number"],textarea{
line-height: 1.8;
letter-spacing: 0.5px;
padding: 5px 10px;
border-radius: 5px;
width: 100%;
border: 1px solid #ccc;
display: inline-block;
font-size: 1rem;
outline: none;
background: #fff;
}
textarea{
line-height: 1.3;
letter-spacing: 0.1px;
min-height: 80px;
max-height: 150px !important;
}
select{
line-height: 2;
font-size: 1rem;
padding: 10px 10px;
border-radius: 5px;
border: 1px solid #ccc !important;
outline: 0;
width: 100%;
color: #434343;
text-shadow: 0 1px white;
/* Fallback for IE 8 */
background: #fff;
/* "transparent" doesn't work with Opera */
background: rgba("#000", 0) !important;
-webkit-appearance: none;
}
select {
-moz-appearance: menulist;
-webkit-appearance: menulist;
}
select::-ms-expand {
display: block;
}
select::before {
position: absolute;
top: 0.8em;
right: 0.8em;
width: 0;
height: 0;
padding: 0;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #da3c41;
pointer-events: none;
}

/*バリデーションによるスタイル指定*/
/*UAのautofillで自動付与されるスタイルを打消し*/
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px #fff inset;
}
input.error:-internal-autofill-selected {
background: #fff !important;
}
/*//UAのautofillで自動付与されるスタイルを打消し*/
input.invalid,input:invalid,input.error,select:invalid,textarea:invalid {
border: #84bde0 1px solid !important;
background: #eff9ff;
}
input:valid,input[type="text"]:valid,input[type="tel"]:valid,select:valid,textarea:valid {
background: #fff;
}
input:focus,input[type="tel"]:focus,textarea:focus,select:focus {
border: 1px solid #84bde0;
background: #fcfeff;
outline: 0;
}

/*placeholder*/
::-webkit-input-placeholder {/* Chrome */
color: #a1bac6;
}
::-moz-placeholder {/* Firefox */

color: #a1bac6;
}
:-ms-input-placeholder {/* IE */

color: #a1bac6;
}
/*//placeholder*/
/*//バリデーションによるスタイル指定*/

/*必須マーク*/
.hs-form-field label span.hs-form-required {
color: #c43671;
font-weight: normal;
font-size: 0.75rem;
letter-spacing: 0.5px;
line-height: 100%;
margin: 0 0 1px 3px;
display: inline-block;
vertical-align: middle;
}
/*//必須マーク*/

/*HubSpot設定のテキスト*/
.hs-richtext,.hs-main-font-element{
font-size: 0.75rem;
margin: 0.4rem 0;
padding:0.625rem;
line-height: 1.5;
}
.hs-richtext a,.hs-main-font-element a{
color: #0179c5;
display: inline-block;
padding: 0 2px;
text-decoration: underline;
}
.hs-richtext a,.hs-main-font-element a span{
color: #0179c5;
text-decoration: underline;
}
.hs-richtext a:hover,.hs-main-font-element a:hover,
.hs-richtext a,.hs-main-font-element a span:hover{
color: #3aa7ea;
text-decoration: none;
}

/*チェックボックス*/
.hs-fieldtype-checkbox ul{
width: 100%;
margin-top: 0;
}
.hs-fieldtype-checkbox ul li{
display: inline-block;
padding: 0 10px 5px 0;
line-height: 1.8;
}
.hs-fieldtype-checkbox ul li label{
width: 100% !important;
}
.hs-fieldtype-checkbox ul li label span,div.hs-form-field label.hs-form-booleancheckbox-display span{
font-weight: normal;
font-size: 1rem;
}
input[type="checkbox"]{
display: inline-block;
width: 25px !important;
height: 25px !important;
vertical-align: -6px;
margin-right: 5px;
}
/*//チェックボックス*/

/*ラジオボタン*/
.hs-fieldtype-radio ul{
width: 100%;
}
.hs-fieldtype-radio ul li{
display: inline-block;
padding: 0 10px 5px 0;
line-height: 1.8;
}
.hs-fieldtype-radio ul li:last-of-type{
padding: 0 0 0 0;
}
.hs-fieldtype-radio ul li label{
width: 100%;
display: inline-block;
margin-right: 5px;
}
.hs-fieldtype-radio ul li label span{
font-weight: normal;
font-size: 1rem;
}
input[type="radio"]{
display: inline-block;
width: 25px !important;
height: 25px !important;
margin-right: 5px;
vertical-align: middle;
}
/*//ラジオボタン*/

/*エラーメッセージ*/
ul.hs-error-msgs li label{
line-height: 1.3;
color: #ff6d6d;
font-size: 0.75rem;
margin: 0.4rem auto 0 auto;
text-align: justify;
display: block;
width: 100%;
padding: 0;
position: relative;
}
ul.hs-error-msgs li label::before{
content: "▲";
position: relative;
padding-right: 2px;
display: inline-block;
}
ul.hs-error-msgs li label a{
text-decoration: underline;
color: #ff6d6d;
}
ul.hs-error-msgs li label a:hover{
text-decoration: none;
color: #f48484;
}
.hs_error_rollup{
margin-top:0.4rem;
}
.hs_error_rollup ul.hs-error-msgs li label{
padding: 0.625rem 0 !important;
line-height: 2;
display: block;
margin: 0 auto;
font-size: 1rem;
font-weight: bold;
text-align: center;
background: #ffe8e8;
border-radius: 1px;
border: 1px solid #ffe8e8;
}
.hs_error_rollup ul.hs-error-msgs li label::before{
display: none;
}
/*//エラーメッセージ*/

/* submit button */
.hs_submit {
margin: 10px auto 10px auto;
text-align: center;
}
input[type="submit"].hs-button {
color: #fff;
background-color: #f38b2e ;
text-decoration: none;
cursor: pointer;
display: block;
font-size: 1.25rem;
font-weight: normal;
line-height: 1;
margin: 0.937rem auto;
padding:1.25rem 0.625rem;
text-align: center;
border-radius: 0.5rem;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
word-wrap:break-word !important;
width: 90%;
max-width: 600px;
border: 1px solid #f38b2e;
-webkit-appearance: none;
}
.hs-form .hs-button:hover{
background-color: #f79d16 !important;
border: 1px solid #ef9207;
}
.hs-form .hs-button:focus {
background-color: #f79d16 !important;
border: 1px solid #ef9207;
}
/* //submit button */
/*end //HubSpot（#form-item）デザイン設定_____________________________*/


/*----------------------------------------------------
for mobile
------------------------------------------------------*/
@media (max-width: 640px) {
/*共通デザイン設定________________________________________*/
.content{
padding:0 0.5rem;
}
/*header*/
header .content img{
width:120px;
}
/*//header*/
/*#title-block*/
section#title-block{
margin-top: 52px;
}
section#title-block h2{
font-size: 1.5rem;
padding: 1rem 0;
letter-spacing: 0.1rem;
}
/*#breadcrumbs*/
ul#breadcrumbs{
display: none;
}
/*//#breadcrumbs*/
/*#main-block*/
section#main-block{
padding: 0.625rem;
}

#form-item.item,.item {
width: 100%;
margin-bottom: 1.25rem;
}
section#main-block .content{
display: block;
padding: 0;
}
.item h3{
text-align: center;
padding: 0 0 0.937rem 0;
font-size: 1.125rem;
}
.item p{
font-size: 0.875rem;
}
.item .float-img{
float: none;
display: block;
width: 100%;
max-width: 300px;
height: auto;
padding: 0 ;
margin: 0 auto 0.625rem auto;
}
.item-ul-list li{
font-size:0.875rem;
}
#hbspt-form-wrap{
padding: 0.85rem ;
}
.h4-present-title-color-red{
display: block;
margin: 0.4em auto;
font-size: 90%;
}

/*//#main-block*/
/*footer*/
footer{
padding: 1rem 0;
}
#footer-logo{
text-align: center;
padding: 1.25rem 0 0 0;
}
#footer-logo img{
width:150px;
height: auto;
}
.copyright{
padding-top: 0.625rem;
font-size:0.625rem;
line-height: 1;
color: #fff;
}
/*//footer*/
/*end //共通デザイン設定_____________________________*/

/* ubSpot（#form-item）デザイン設定_____________________________*/
fieldset.form-columns-2{
display: block;
border-collapse: inherit;
}
fieldset.form-columns-2 div.hs-form-field,fieldset.form-columns-2 div.field{
display: block;
}
fieldset.form-columns-2 div.hs-form-field:first-child,fieldset.form-columns-2 div.field:first-child{
padding-right: 0px !important;
}
input[type="submit"].hs-button{
padding:  1.25rem 0.25rem;
font-size: 16px;
}
.hs_error_rollup ul.hs-error-msgs li label{
font-size: 0.875rem;
margin: 0.625rem auto
}
/*end //HubSpot（#form-item）デザイン設定_____________________________*/
}


/*----------------------------------------------------
  dlpanel
---------------------------------------------------- */

.dlpanel .dlpanel-title {
  color: #353535;
  background: #ffeb5d;
  text-align: center;
  font-weight: bold;
  font-size: 1.6em;
  padding: 0.8em .4em 0.7em;
  margin-bottom: 1em;
}
.dlpanel .dlpanel-title img {
  position: relative;
  height: 1.4em;
  vertical-align: middle;
  padding-right: .2em;
  top: -0.1em;
}
.dlpanel .dlpanel-color-red {
  color: #ff2140;
  padding-left: .1em;
}
.dlpanel .dlpanel-body > * {
  margin-bottom: 1.4em;
  line-height: 1.6;
}
.dlpanel .dlpanel-box-ttl {
  font-size: 1.2em;
  font-weight: bold;
  color: #0179c5;
  text-align: center;
}
.dlpanel .dlpanel-box-ttl-big {
  font-size: 1.6em;
  font-weight: bold;
  color: #0179c5;
  text-align: center;
}
.dlpanel-box-ttl-underline {
  font-size: 1.2em;
  font-weight: bold;
  color: #353535;
  text-align: left;
  border-bottom: 3px solid #0179c5;
  padding: 0 0 0.4em 0.25em;
  margin-bottom: 0.4em;
}
.dlpanel .dlpanel-box-ttl-small {
  margin-top: 10px;
  font-size: 0.8em;
  font-weight: bold;
  color: #0179c5;
  text-align: center;
}
.dlpanel .dlpanel-box {
  border: 1px solid #83c1da;
  background: #eff9ff;
  padding: 20px 20px;
  border-radius: 3px;
}
.dlpanel .dlpanel-box ul,
.dlpanel .dlpanel-box ol {
  font-weight: bold;
  line-height: 1.6;
  padding-left: 1.6em;
}
.dlpanel .dlpanel-box ul li,
.dlpanel .dlpanel-box ol li {
  position: relative;
}
.dlpanel .dlpanel-box ul li::before {
  content: '';
  position: absolute;
  width: 0.7em;
  height: 0.7em;
  border: .2em solid #0179c5;
  top: 0.4em;
  left: -1.2em;
  border-radius: 50%;
}
.dlpanel .dlpanel-box ol {
  list-style: decimal;
}
.dlpanel .dlpanel-catch {
  color: #0179c5;
  line-height: 1.6;
  text-align: center;
  font-weight: bold;
}
.dlpanel .dlpanel-img {
  font-size: .95em;
  line-height: 1.4;
}
.dlpanel .dlpanel-img img {
  width: 100%;
}
.dlpanel .dlpanel-img .dlpanel-img-small {
  max-width: 350px;
  margin: 0 auto;
  display: block;
}
.dlpanel .dlpanel-figure {
  width: 100%;
  height: auto;
}
.dlpanel .dlpanel-figure img {
  width: 100%;
  height: auto;
}
.dlpanel-checklist {
  padding: 20px;
  background: #fffcee;
  border-radius: 0 0 5px 5px;
  border: 1px solid #f5dd55;
}
.dlpanel-checklist li {
  position: relative;
  padding-left: 30px;
}
.dlpanel-checklist li::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 7px;
  transform: rotate(50deg);
  width: 5px;
  height: 10px;
  border-right: 2px solid #0179c5;
  border-bottom: 2px solid #0179c5;
}
.dlpanel-checklist li::after {
  content: '';
  position: absolute;
  top: .2em;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #83c1da;
  border-radius: 2px;
}
.dlpanel .dlpanel-body p.dlpanel-checklist-title {
  margin-bottom: 0;
  padding: 5px;
  border-radius: 5px 5px 0 0;
  font-weight: bold;
  text-align: center;
  background: #fff1a0;
  border: 1px solid #f5dd55;
  border-bottom: none;
}
.dlpanel-figureflex {
  display: flex;
  justify-content: space-between;
}
.dlpanel-figureflex img {
  width: 48%;
  height: auto;
  margin: 0 auto;
}
@media (max-width: 640px) {
  .dlpanel-figureflex {
    flex-direction: column;
  }
  .dlpanel-figureflex img {
    width: 100%;
    height: auto;
    margin: 10px auto;
  }
}