@charset "utf-8";

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

modal

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

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

/*---------------------------------------------
pc 1024px-
---------------------------------------------*/
.popupModal > input { display: none; }
.popupModal > input:nth-child(1) + label { cursor: pointer; /*padding: 16px 3px;*/ }
.popupModal > input:nth-child(1) + label i { font-size:93%; color:#fff; }
.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: 54px;
line-height: 22px;
letter-spacing: normal;
padding: 5px;
position: fixed;
right:10px;
top: 10px;
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;
/*left: 50%;*/
/*top: 50%;*/
/*-webkit-transform: translate(-50%,-50%);*/
/*-ms-transform: translate(-50%,-50%);*/
/*transform: translate(-50%,-50%);*/
/*padding:20px 10px 10px 20px;*/
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%;
}

/* ラジオ１ 以外のラベルを初期は非表示 */
.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: 5px;
color: #1a1a1a;
display: inline-block;
display: block;
height: 39px;
line-height: 20px;
letter-spacing: normal;
padding: 6px 0  0;
position: absolute;
right:0;
top: 0;
text-align: center;
text-decoration: none;
vertical-align:bottom;
width: 38px;
z-index:300003;
}

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label:hover { cursor:pointer; height:auto; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label div {}
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label div i { color:#333 !important; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label div span { display:block; font-size:69%; text-align:center; line-height:1; }


#header #header_cont a#menuBtn i

.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 25px 15px 20px;
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-color: #efefef;
text-align: center;
color: #333;
font-size: 69%;
letter-spacing:normal;
line-height:1.4;
margin: 0 auto;
padding: 7px 20px;
text-align: left;
width: 100%;
}


.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title h2 {
float: none;
margin:0;
display:block;
padding:15px 80px 15px 15px;
width:100%;
position:relative;
text-align:left;
vertical-align:middle;
letter-spacing:-.40em; 
}

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

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title h2 a img { display:inline-block; letter-spacing:normal; max-width:60px; }

.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .logo_title { display:inline-block; letter-spacing:normal; vertical-align:middle; padding-left: 10px; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .logo_title h3 { font-size: 147%; font-weight: 600; }
.popupModal > input:nth-child(1):checked + label + input:nth-child(3) + label + input:nth-child(5) + label + .modalPopup_window .modal_title .logo_title span { font-size: 100%; margin-top: 7px !important; }

.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; border-top:1px solid #ccc; padding:20px 10px 30px; }

/*---------------------------------------------------------------
sp_fNav
---------------------------------------------------------------*/
#sp_fNav { border-top:none; }
#sp_fNav #sp_fNav_cont { background-color:#fff; padding:0; width:100%; }
#sp_fNav #sp_fNav_cont ul { border-top:1px solid #ccc; }
#sp_fNav #sp_fNav_cont ul li { border-bottom:1px solid #ccc; letter-spacing:normal; padding:0; width:100%; }
#sp_fNav #sp_fNav_cont ul li a {
background-color:#fff;
background-image:url(../../img/common/i_ar_gray.png);
background-position:98% center;
background-repeat:no-repeat; 
background-size:6px 10px;
color:#333;
display:block;
font-size:100%;
letter-spacing:normal;
text-align:left;
padding:15px 15px 15px 20px;
}
#sp_fNav #sp_fNav_cont ul li a i { color:#333 !important; padding-right:3px; }
#sp_fNav #sp_fNav_cont ul li a span { display:inline-block; padding-left:10px; }

#sp_fNav #sp_fNav_cont #conv { padding:30px 20px 0; }
#sp_fNav #sp_fNav_cont #conv dl { margin-right:0; text-align:center; width:100%; }
#sp_fNav #sp_fNav_cont #conv dl dt { width:100%; }
#sp_fNav #sp_fNav_cont #conv dl dt img { width:220px; height:25px; }
#sp_fNav #sp_fNav_cont #conv dl dd { font-size: 100%; letter-spacing: -.40em; line-height: 1.4; margin-top: 12px; letter-spacing:normal; width:100%; }
#sp_fNav #sp_fNav_cont #conv dl dd .address { width:100%; }
#sp_fNav #sp_fNav_cont #conv dl dd .contact { margin-top:30px; width:100%; }
#sp_fNav #sp_fNav_cont #conv dl dd .contact a {
background: #efefef;
border:none;
border-radius: 0;
color: #333;
display: block;
font-size:85%;
font-weight:600;
margin:0 auto;
max-width:300px;
padding: 10px 5px;
text-align:center;
vertical-align:middle;
}

#sp_fNav #sp_fNav_cont #conv dl dd .contact a:hover { background: #efefef; }
#sp_fNav #sp_fNav_cont #conv dl dd .contact a span { display:inline-block; padding-left:10px; }
#sp_fNav #sp_fNav_cont #conv dl dd .contact a img { width: 14px; height: 10px; vertical-align: middle; }

#sp_fNav #sp_fNav_cont #tel dl { padding:30px 0 50px; display:inline-block; text-align:right; width:290px; }
#sp_fNav #sp_fNav_cont #tel dl dt { background-color:#2d67b8; color:#fff; font-size:93%; font-weight:600; letter-spacing:normal; padding:5px; text-align:center; }
#sp_fNav #sp_fNav_cont #tel dl dd { font-size:108%; letter-spacing:normal; margin-top:10px; text-align:center; }
#sp_fNav #sp_fNav_cont #tel dl dd a { display:inline-block; }
#sp_fNav #sp_fNav_cont #tel dl dd img { max-width:145px; }
#sp_fNav #sp_fNav_cont #tel dl dd p { font-size:93%; letter-spacing:normal; line-height:1.4; margin-top:10px; text-align:center; }
#sp_fNav #sp_fNav_cont #tel > p { color:#666; font-size:79%; letter-spacing:normal; padding:100px 10px; width:100%; }

#sp_fNav #sp_fNav_cont .copyright { background-color:#dadada; padding:15px 20px 100px 20px; }
#sp_fNav #sp_fNav_cont .copyright p { font-size: 85%; letter-spacing:normal; }


/*--------------------------------------------------
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;
}

}

/*---------------------------------------------
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 {

}
}


