@charset "utf-8";
/*
Theme Name: 九州電気保安協会アンケート
Theme URI: 
Description: 九州電気保安協会アンケート
Author: 
Version:1.0
*/

/* basic setting */
html, body{ position:relative; width:100%; height:100%; }
body{ -webkit-text-size-adjust: 100%; }
body{
  margin:0;
  padding:0;
  font-size:14px;
  font-family: Arial, Roboto, "Droid Sans", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic;
  line-height:1.5;
  color:#000;
  background:#fff;
  word-break:break-word;
}
h1,h2,h3,h4,h5,h6,p,em,pre,th,td,blockquote{margin:0; padding:0; font-size:100%}
img,table{border:0; vertical-align:bottom}
img{max-width:100%; height:auto}
form,ul,dl,ol{margin:0; padding:0}
li{list-style:none}
a, a:visited{color:#000; text-decoration:none;}
@media screen and (min-width:769px){
  a, input[type="submit"]{transition-duration:0.2s}
  a:hover, input[type="submit"]:hover{opacity:0.7}
  a[href^="tel"]{pointer-events:none}
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{display: block; margin:0; padding:0}
.clr{clear:both}
/*.cf{*zoom:1}*/
.cf:after{content:""; display:block; clear:both}
input[type="submit"]{-webkit-appearance: none; cursor:pointer}

.pr {
  padding-right: 3px;
}

/* header */
header{
}

.header{
  max-width:100%;
  margin:0 auto;
}

.h_inner{
  margin:30px auto 30px auto;
  text-align: center;
}

.header-logo{
  width: 200px;
  height: auto;
}

.contact_name{
  margin:0 auto;
  padding: 30px 20px;
  text-align: center;
  background-color: #00b7f7;
}

.tittle{
  font-size: 20px;
  font-weight: bold;
  color: #fff;
}


/* footer */
footer{
}

.footer{
  max-width:100%;
  margin:0 auto;
}

.foot_logo{
  padding: 10px;
  text-align: center;
  border-top: 1px solid;
  border-top-color: #b0b0b0;

}

.footer-logo{
  width: 200px;
  height: auto;
  padding: 0 0 10px 0;
}

.copy{
  padding: 1em;
  color: #fff;
  background-color: #a5b0b7;
  text-align: center;
}

/* text style */
.fbold{font-weight:bold !important}
.fnormal{font-weight:bold !important}
.talcnt{text-align:center !important}
.tallf{text-align:left !important}
.talrg{text-align:right !important}
.t_red{color:#cd2b2b}


/* container */
.spblock, .spinline{
  display:none;
}

.container{
  max-width:800px;
  margin:0 auto;
  padding:50px 15px;
}

.hoankanri, .shiken_gijyutsu{
  max-width:calc(60% + 30px);
  margin:0px auto 10px auto;
  text-align: center;
}

.shiken_gijyutsu{
  margin-bottom:30px;
}

.gyoumu a, .gyoumu a:visited, .gyoumu span{
  display:block;
  padding:30px;
  font-size: 2em;
  font-weight: bold;
  color:#fff;
  border-radius: 20px;
}
.gyoumu span{
  text-decoration:line-through;
}

.shiken_gijyutsu .gyoumu a{
  background-color: #009944;
}
.shiken_gijyutsu .gyoumu span{
  background-color: #a7e3ce;
}

.hoankanri .gyoumu a{
  background-color: #106ab2;
}
.hoankanri .gyoumu span{
  background-color: #bbcbe8;
}

.notes{
  text-align:center;
}

.login_form p{
  margin-bottom:15px;
}
.login_form .form_box{
  padding-bottom:20px;
  margin-bottom:30px;
  border-bottom:dotted 1px #949494;
}
.login_form dl{
  width:340px;
  margin:0 auto;
}
.login_form dt{
  float:left;
  width:6.2em;
  padding-top:0.3em;
}
.login_form dd{
  margin:0 0 10px;
}
.login_form input[type="text"], .login_form input[type="password"]{
  width:228px;
  border:solid 1px #ccc;
  border-radius:4px;
  font-family: Arial, Roboto, "Droid Sans", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic;
  padding:5px 10px;
}
.login_form input:focus{
  outline:none;
  background:#e5f7f8;
  border-color:#00aebe;
}
.login_form .btn{
  margin-bottom:50px;
}

.stepping{
  margin-bottom:60px;
  padding-right:4px;
}
.stepping ul{
  display:flex;
  justify-content:center;
}
.stepping ul li{
  width:182px;
  text-align:center;
  color:#949494;
  line-height:30px;
  background:#cccccc;
  border-radius:3px 0 0 3px;
  position:relative;
}
.stepping ul li + li{
  margin-left:42px;
}
.stepping ul li::after{
  content:"";
  display:block;
  width:0;
  height:0;
  border-left:solid 9px #ccc;
  border-top:solid 15px transparent;
  border-bottom:solid 15px transparent;
  position:absolute;
  top:0;
  left:100%;
}
.stepping ul li.current{
  color:#fff;
  background:#66dce2;
}
.stepping ul li.current::after{
  border-left:solid 9px #66dce2;
}

.enquete h3{
  font-size:16px;
  margin-bottom:20px;
}
.enquete .qitem{
  margin-bottom:30px;
  padding-bottom:30px;
  border-bottom:dotted 1px #4c4c4c;
}
.enquete.enquete_confirm .qitem{
  padding-bottom:25px;
}
.enquete .qitem .qtext{
  margin-bottom:10px;
  padding-left:3em;
  text-indent:-3em;
}
.enquete .qitem .qtext2{
  margin-bottom:10px;
  padding-left:calc(1em + 15px);
  text-indent:-1em;
}
.enquete .qitem .qtext2 .small{
  display:block;
  padding-left:0;
  text-indent:0;
  font-size:13px;
  color:#c00;
}
.enquete .qitem .abox{
  padding-left:30px;
  margin-bottom:20px;
}
.enquete .qitem > p:not(.qtext):not(.qtext2){
  padding-left:30px;
  margin-bottom:5px;
}
.enquete .qitem .qtext_nonindent{
  margin-bottom:10px !important;
  padding-left:0 !important;
}
.enquete .necessary{
  color:#D80C18;
}
.enquete label{
  display:inline-block;
  margin:0 28px 4px 0;
}
.enquete .abox label:last-of-type{
  margin-right:5px;
}
.enquete .abox label input{
/*  display:none;*/
  position:absolute;
  opacity:0;
}
.enquete .abox label span{
  display:inline-block;
  padding-left:18px;
  position:relative;
}
.enquete .abox_radio label span::before,
.enquete .abox_checkbox label span::before{
  content:"";
  display:block;
  width:12px;
  height:12px;
  border:solid 1px #aaa;
  position:absolute;
  top:3px;
  left:0;
}
.enquete .abox_radio label input:focus ~ span,
.enquete .abox_checkbox label input:focus ~ span{
  outline:dotted 1px #333;
}
.enquete .abox_radio label input:checked ~ span::after{
  content:"";
  display:block;
  width:8px;
  height:8px;
  background:#08a09e;
  position:absolute;
  top:6px;
  left:3px;
}
.enquete .abox_radio label input:checked ~ span::before,
.enquete .abox_checkbox label input:checked ~ span::before{
  border-color:#08a09e;
}
.enquete .abox_radio label span::before,
.enquete .abox_radio label input:checked ~ span::after{
  border-radius:50%;
}

.enquete .abox_checkbox label input:checked ~ span::after{
  content:"";
  display:block;
  width:7px;
  height:3px;
  border-left:solid 3px #08a09e;
  border-bottom:solid 3px #08a09e;
  position:absolute;
  top:6px;
  left:2px;
  transform:rotate(-45deg);
}

.enquete textarea, .enquete input[type="text"]{
  border:solid 1px #ccc;
  border-radius:4px;
  font-family: Arial, Roboto, "Droid Sans", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic;
  padding:5px 10px;
}
.enquete textarea{
  width:90%;
  max-width:658px;
  height:68px;
  margin-left:30px;
}
.enquete input[type="text"]{
  width:228px;
}
.enquete input[type="text"].eigyo_enq{
  width:calc(100% - 22px);
  max-width:600px;
}
::placeholder{
  color:#999;
  font-size:14px;
}
.enquete textarea:focus, .enquete input[type="text"]:focus{
  outline:none;
  background:#e5f7f8;
  border-color:#00aebe;
}

.enquete .qitem .atext{
  color:#0097cb;
}
.enquete .qitem textarea + .qtext,
.enquete .qitem textarea + .qtext2,
.enquete .qitem p:not(.qtext):not(.qtext2) + .qtext,
.enquete .qitem p:not(.qtext):not(.qtext2) + .qtext2,
.enquete .qitem .atext + .qtext,
.enquete .qitem .atext + .qtext2{
  margin-top:30px;
}

.enquete .qitem dl{
  margin-left:30px;
}
.enquete .qitem dl dt{
  float:left;
  width:5em;
  padding-top:5px;
}
.enquete .qitem .bousai dl dt{
  width:11em;
}
.enquete.enquete_confirm .qitem dl dt{
  padding-top:0;
}
.enquete .qitem dl dd{
  margin-bottom:10px;
}
.enquete.enquete_confirm .qitem dl dd{
  margin-bottom:5px;
}

.contact_block .btn{
  text-align:center;
}
.contact_block .btn input[type="submit"]{
  font-size:14px;
  color:#fff;
  line-height:32px;
  padding:0 18px;
  margin:0 10px;
  border:solid 1px #ccc;
  background:linear-gradient( #85e3e7, #00a0ad );
  border-radius:5px;
}

.enquete_thanks figure{
  text-align:center;
  margin-bottom:30px;
}

.error, .error_top{
  color:#fff;
  font-weight:bold;
  background:#f33;
  padding:5px 10px;
}
.error{
  margin-right:30px;
}
.error_top{
  margin:0 30px;
}
.error_top + .stepping{
  margin-top:20px;
}

.leadtxt_block{
  margin-bottom:50px;
}
.leadtxt_block h2{
  font-size:20px;
  text-align:center;
  margin-bottom:10px;
}
.leadtxt_block p{
  line-height:1.8;
}
.leadtxt_block .box_1{
  padding:20px;
  margin:25px 0;
  border:solid 3px #999;
}
.leadtxt_block .box_1 h3{
  font-size:16px;
  text-align:center;
  margin-bottom:5px;
}
.leadtxt_block .box_2{
  background:#fff8df;
  padding:16px 140px 16px 40px;
  position:relative;
}
.leadtxt_block .box_2 p{
  font-size:16px;
  line-height:1.6;
}
.leadtxt_block .box_2 figure{
  width:118px;
  position:absolute;
  right:20px;
  top:-13px;
}
.leadtxt_block .box_2 .small{
  font-size:12px;
}

.power_supply_block{
  margin-bottom:40px;
}
.power_supply_block h3{
  margin-bottom:50px;
}
.power_supply_block .items{
  margin-bottom:40px;
}
.power_supply_block .items h4{
  padding-bottom:0;
  margin-bottom:25px;
  border-bottom:solid 1px #666;
  font-size:16px;
  color:#006934;
  line-height:2em;
}
.power_supply_block .items h4 span{
  display:inline-block;
  color:#fff;
  background:#ed6d34;
  padding:0 10px;
  margin-right:5px;
}
.power_supply_block .items .list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:30px 3%;
}
.power_supply_block .items .list .item{
  width:48%;
  display:flex;
  justify-content:space-between;
}
.power_supply_block .items .list .item figure{
  width:47%;
}
.power_supply_block .items .list .item.end figure{
  width:100%;
}
.power_supply_block .items .list .item .txt{
  width:50%;
  line-height:1.4;
  word-break:break-all;
}
.power_supply_block .items .list .item .txt h5{
  font-size:14px;
}
.power_supply_block .items .list .item .txt p{
  font-size:13px;
}
.power_supply_block .information{
  font-size:18px;
  font-weight:bold;
  text-align:center;
  padding:8px 0;
  border-top:solid 1px #666;
  border-bottom:solid 1px #666;
  word-break:break-all;
}
.power_supply_block .information span{
  display:block;
  font-size:15px;
  font-weight:normal;
}


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


}/* max-width:768px */


/* ------------------------------------------------------------------------------------------- */
@media screen and (max-width:480px){
/* ------------------------------------------------------------------------------------------- */

.spblock{
  display:block;
}
.spinline{
  display:inline;
}

.login_form dl{
  width:250px;
}
.login_form dt{
  float:none;
  width:auto;
  padding-top:0;
}

.stepping{
  margin-bottom:40px;
}
.stepping ul li{
  width:calc((100% - 67px) / 3);
}
.stepping ul li + li{
  margin-left:20px;
}

.enquete .qitem{
  margin-bottom:25px;
  padding-bottom:25px;
}
.enquete.enquete_confirm .qitem{
  padding-bottom:20px;
}
.enquete .qitem .qtext,
.enquete .qitem .qtext2{
  margin-bottom:10px;
  padding-left:0;
  text-indent:0;
}
.enquete .qitem .abox{
  padding-left:15px;
}
.enquete .qitem > p:not(.qtext):not(.qtext2){
  padding-left:15px;
}
.enquete label{
  display:block;
}
.enquete .abox label:last-of-type{
  margin-right:0;
}

.enquete textarea, .enquete input[type="text"]{
  padding:5px 5px;
}
.enquete textarea{
  width:87%;
  margin-left:15px;
}
.enquete dd input[type="text"],
.enquete input[type="text"].eigyo_enq{
  width:calc(100% - 5em);
}
.enquete .qitem textarea + .qtext,
.enquete .qitem .atext + .qtext,
.enquete .qitem textarea + .qtext2,
.enquete .qitem .atext + .qtext2{
  margin-top:25px;
}

.enquete .qitem dl{
  margin-left:15px;
}
.enquete .qitem .bousai dl dt{
  width:100%;
  margin-bottom:3px;
}
.enquete .qitem .bousai dl dd{
  margin-left:0;
}

.hoankanri_gyoumu{
  max-width:90%;
  margin:0 auto;
  padding:15px 15px;
  font-size: 1.3em;
  font-weight: bold;
  color: #fff;
}

.shiken_gijyutsu_gyoumu{
  max-width:90%;
  margin:0 auto;
  padding:15px 30px;
  font-size: 1.3em;
  font-weight: bold;
  color: #fff;
}

.error{
  margin-right:15px;
}
.error_top{
  margin:0 15px;
}

.leadtxt_block h2{
  font-size:17px;
}
.leadtxt_block .box_2{
  padding:16px 20px;
}
.leadtxt_block .box_2 figure{
  position:relative;
  right:auto;
  top:auto;
  margin:10px auto 0;
}

.power_supply_block h3{
  margin-bottom:30px;
}
.power_supply_block .items h4{
  font-size:15px;
  line-height:1.3;
  padding-bottom:5px;
}
.power_supply_block .items h4 span{
  display:block;
  width:max-content;
  line-height:1.7em;
  margin-right:0;
  margin-bottom:5px;
}
.power_supply_block .items .list .item{
  width:100%;
}
.power_supply_block .items .list .item figure{
  width:45%;
}
.power_supply_block .items .list .item .txt{
  width:53%;
}
.power_supply_block .items .list .item .txt h5{
  font-size:13px;
}
.power_supply_block .items .list .item .txt p{
  font-size:12px;
}
.power_supply_block .information{
  font-size:14px;
  text-align:left;
}
.power_supply_block .information span{
  font-size:13px;
}


}/* max-width:480px */


.select_deco{
  display:inline-block;
  border:solid 1px #ccc;
  border-radius:3px;
  background:#fff;
  font-size:14px;
  position:relative;
}
.select_deco.active{
  border-color:#00aebe;
}
.select_deco::before{
  content:"";
  display:block;
  width:0;
  height:0;
  border-top:solid 6px #aaa;
  border-left:solid 4px transparent;
  border-right:solid 4px transparent;
  position:absolute;
  top:calc(50% - 4px);
  right:5px;
  z-index:20;
}
.select_deco select{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width:100%;
  height:1.5em;
  background:transparent;
  font-size:inherit;
  font-family: Arial, Roboto, "Droid Sans", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic;
  border:0;
  margin:0;
  padding:0 16px 0 0;
  position:relative;
  z-index:10;
}
.select_deco select::-ms-expand{
  display:none;
}
.select_deco select:focus{
  outline:none;
  background:#e5f7f8;
  border-color:#00aebe;
}

.abox .select_area{
  padding-left:2.5em;
  margin-bottom:1em;
}

.note{
  display:flex;
  justify-content:center;
  margin-bottom:40px;
}
.note p{
  font-weight:bold;
}

.example{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
}
.example a{
  display:block;
  width:270px;
  padding:7px 0;
  margin:7px;
  text-align:center;
  background:#11abb3;
  border-radius:5px;
  color:#fff;
  cursor:pointer;
}