@charset "utf-8";

/*---------------------------------------------

modal

---------------------------------------------*/

* {
margin: 0;
padding: 0;
font-size: 100%;
}

/*---------------------------------------------
pc 1024px-
---------------------------------------------*/
.popupModal > input { display: none; position:relative; }
.popupModal > input:nth-child(1) + label { line-height:1; cursor: pointer; padding: 0; }
.popupModal > input:nth-child(1) + label i { font-size:93%; padding-right:2px; color:#666; }
.modalPopup_window { display: none; }
.modalPopup_cont { overflow-y:scroll; padding:0; }

/*--- close ---*/
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label:hover { cursor:pointer; }

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label {
background-color: #fff;
border: 1px solid #ccc;
border-radius: 5px;
color: #333;
display: inline-block;
display: block;
height: 56px;
line-height: 22px;
letter-spacing: normal;
padding: 5px;
position: fixed;
right:10px;
top: 42px;
text-align: center;
text-decoration: none;
vertical-align:bottom;
width:56px;
z-index:300003;
}

/* ラジオ１ チェックでポップアップ表示 */
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window {
display: block;
position: fixed;
width: 100%;
height: 100%;
border-radius: 0;
left: 0;
top: 0;
overflow: hidden;
z-index:300002;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window > div {
color:#1a1a1a;
-webkit-overflow-scrolling:touch;
display: inline-block;
width: 100%;
height: 100%;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window > div.modalPopup_cont {
padding:0;
position:relative;
border-radius:0;
background-color:#fff;
font-size:100%;
text-align:center;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window div.modalMain {
padding:0;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window > div > iframe {
width: 100%;
height:100%;
border:none;
display:block;
}

/* ポップアップの中の要素 */
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window > div > img {
max-width: 100%;
}

/*---------------------------------------------------------------
sp_fNav
---------------------------------------------------------------*/
#sp_fNav { font-size:16px; }
#sp_fNav #sp_fNav_cont { border-top:1px solid #ccc; padding:20px 0 0; }

/*---- func ---*/
#sp_fNav #sp_fNav_cont .func { background-color:#fff; padding:0; }
#sp_fNav #sp_fNav_cont .func > h3 {
background-color: #333;
position: relative;
font-size: 100%;
text-align: left;
color: #fff;
display: block;
font-weight: 600;
line-height: 1;
padding:5%;
}

#sp_fNav #sp_fNav_cont dl { margin-top:20px; }
#sp_fNav #sp_fNav_cont dl:first-child { margin-top:0; }
#sp_fNav #sp_fNav_cont dl dt {
background-color:#000;
color:#fff;
font-size:93%;
font-weight:600;
padding:10px 15px;
text-align:left;
}
#sp_fNav #sp_fNav_cont dl dd {}
#sp_fNav #sp_fNav_cont dl dd ul { letter-spacing:-.40em; text-align:center; padding:0; }
#sp_fNav #sp_fNav_cont dl dd ul li {
border-bottom:1px solid #ccc;
text-align:center;
letter-spacing:normal;
margin:0;
vertical-align:middle;
width:100%;
}
#sp_fNav #sp_fNav_cont dl dd ul li:first-child { margin-top:0; }
#sp_fNav #sp_fNav_cont dl dd ul li a {
background-image: url("../../images/common/i_ar_gray.png");
background-position: 98% center;
background-repeat: no-repeat;
background-size:9px 14px;
color:#333;
display:block;
font-size:85%;
padding:15px;
text-decoration:none;
border-radius:0;
text-align:left;
margin:0 auto;
width:100%;
}
#sp_fNav #sp_fNav_cont dl dd ul lia:hover { text-decoration:none; }


/*---- new_function ---*/
#sp_fNav #sp_fNav_cont .new_function { margin-top:20px; }
#sp_fNav #sp_fNav_cont .new_function ul { border-top:1px solid #ccc; text-align:left; }
#sp_fNav #sp_fNav_cont .new_function ul li { text-align:left; }
#sp_fNav #sp_fNav_cont .new_function ul li a {
background-image:url(../images/sp/i_ar.png);
background-position: 98% center;
background-repeat: no-repeat;
background-size: 6px 10px;
border-bottom:1px solid #ccc;
color:#333;
display:block;
font-size:88%;
font-weight:400;
padding:30px 10px;
text-decoration:none;
text-align:left;
margin:0 auto;
width:100%;
}



#sp_fNav #sp_fNav_cont .reason dl dd.singleLink { margin-top:20px; }
#sp_fNav #sp_fNav_cont .reason dl dd.singleLink a {
background-image:url(../images/sp/i_ar.png);
background-position: 98% center;
background-repeat: no-repeat;
background-size: 6px 10px;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
color:#333;
display:block;
font-size:88%;
font-weight:400;
padding:20px 10px;
text-decoration:none;
text-align:left;
margin:0 auto;
width:100%;
}


/* ラジオ１ 以外のラベルを初期は非表示 */
.popupModal > input:nth-child(1) + label ~ label {
display: none;
}
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label {
display: block;
text-indent: -999999px;
}

/*--- close ---*/
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label:hover { cursor:pointer; }

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label {
background-color: #fff;
border-radius: 2px;
color: #1a1a1a;
display: block;
height: 48px;
line-height: 1.2;
letter-spacing: normal;
display:flex;
justify-content:center;
position: fixed;
right:10px;
top: 10px;
text-align: center;
text-decoration: none;
vertical-align:bottom;
width:46px;
z-index:300003;
font-size:69%;
vertical-align:middle;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label:hover { cursor:pointer; }

.modalPopup_window {
animation: fadeIn 1s ease 0s 1 normal;
-webkit-animation: fadeIn 1s ease 0s 1 normal;
padding-bottom:0;
}

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

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

input::before,
input+label::before,
input::after,
input label::after,
label::before,
input::before {}

/*--- modal_title ---*/
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title {
letter-spacing:-.40em;
overflow:hidden;
height:auto;
padding: 15px 80px 15px 15px;
text-align:left;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modalMain h1 {
background: transparent;
color: #fff;
font-size: 10px;
margin: 0 auto;
padding:0;
text-align: center;
width: 100%;
}
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modalMain h1 a {
border:none !important;
padding:0 !important;
}
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modalMain h1 a img {
margin:0;
max-width: 95px;
height: auto;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .logo {
float: none;
align-items:center;
justify-content:flex-start;
display:flex;
margin:0;
padding:0;
width:100%;
position:relative;
text-align:left;
vertical-align:middle;
font-size:100%; 
line-height: 1;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .logo > span:first-child { position:relative; max-width:40px; text-align:left; vertical-align:middle; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .logo span:first-child img { display:inline-block; letter-spacing:normal; max-width:40px; }

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .txt { display:block; vertical-align:bottom; padding-left: 13px; }


.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title div h2#logo { line-height:1; padding-left:0; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title div h2#logo a { display:block; margin-top:4px; line-height:1; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title div h2#logo a img { width:123px; height:auto; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .txt span { font-size: 69%; font-weight:normal; letter-spacing:normal; margin-top:0; line-height:1; }

.linkBtn { padding:0 10px 20px; }
.linkBtn ul { border:1px solid #ccc; border-radius:5px; text-align:center; }
.linkBtn ul li { border-radius:0; }
.linkBtn ul li:first-child { border-radius:5px 5px 0 0; }
.linkBtn ul li:last-child { border-radius:0 0 5px 5px; }

.linkBtn ul li a {
background-image: url("../images/sp/i_ar.png");
background-repeat: no-repeat;
background-position:98% center;
background-size:6px 10px;
background-color: #fff;
border-top:1px solid #ccc;
border-radius:0;
color: #1a1a1a;
display: block;
font-size:88%;
font-weight:400;
letter-spacing: normal;
line-height:1.6;
padding: 20px 10px;
text-align: center;
text-decoration: none;
vertical-align:bottom;
}

.linkBtn ul li:first-child a {
border-radius:5px 5px 0 0;
border-top:none;
}
.linkBtn ul li:last-child a {
border-radius:0 0 5px 5px;
}

.linkBtn.group { background-color:#eee; padding:20px 10px 30px; }

.modal-close { display:flex; align-items:center; flex-wrap:wrap; justify-content:center; text-align:center; }
.modal-close i { display:block; font-size:117%; padding:0;  }
.modal-close span { display:block;  padding:0; width:100%; }

/*---------------------------------------------------------------
social_media
---------------------------------------------------------------*/
dl.social_media { background-color:#fff; padding:20px 15px; float:none; width:100%; float:none !important; }
dl.social_media dt { border:none; font-size:79%; padding:0; text-align:center; }
dl.social_media dd { border:none; text-align:center; margin-top:15px; padding:0; }
dl.social_media dd ul { display:inline-block; letter-spacing:-.40em; margin:0 auto; text-align:center; width:100%; border:none; }
dl.social_media dd ul li { display:inline-block; letter-spacing:normal; width:33% !important; border:none; padding:0; }
dl.social_media dd ul li:nth-child(2) { width:34%; }
dl.social_media dd ul li a { text-decoration:none; }
dl.social_media dd ul li a:hover { text-decoration:none; }
dl.social_media dd ul li a img { width:32px; height:32px; }
dl.social_media dd ul li a span { display:block; margin-top:5px; color:#333; font-weight:400; font-size:79%; }

#fCorp .inner dl.social_media dd ul { background-color:transparent; border:none; }
#fCorp .inner dl.social_media dd ul li { display:inline-block; letter-spacing:normal; width:33% !important; border:none; padding:0; vertical-align:middle; }
#fCorp .inner dl.social_media dd ul li:nth-child(2) { width:34%; }

/*--------------------------------------------------
tablet 768-1024px
----------------------------------------------------*/
@media screen and (min-width:768px) and ( max-width:1024px) {

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window {
height: 100%;
width:100%;
padding:0;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label {
vertical-align:bottom;
display:flex;
justify-content:center;
}

}

/*---------------------------------------------
sp -768px
---------------------------------------------*/
@media screen and (max-width:767px){

input+label { display:block; font-size:100%; }

.serviceList ol.solution li { width:48%; }
.serviceList ol.solution li:nth-child(2),
.serviceList ol.solution li:nth-child(5) { width:48%; }
.serviceList ol.solution li a dl dd { padding:10px 0; }

}

/*---------------------------------------------
sp -480px
---------------------------------------------*/
@media screen and (max-width:480px){
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label {
right:10px;
top: 42px;
}
}