@charset "utf-8";

.pchide {	display:none; }
.pcbr { display: block; }

#TEST2 {}

@keyframes zoomUp {
0% {
  transform: scale(1);
}
100% {
  transform: scale(1.15);
}
}

#head_wrap { display: none; }

body { padding: 0; margin: 0; }

#wrapper h1 img { width: 90%; height: auto; }

#navi { background-color: #004F2B; width: 100%; }
#navi ul { list-style: none; margin: 0 auto; padding: 0; width: 1000px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-evenly; }
#navi ul li a { color: #fff; text-decoration: none; padding: 30px 0; display: inline-block; font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 400; }
#navi ul li.gray span {text-decoration: none; padding: 30px 0; display: inline-block; font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 400;color: #919191;}
#navi ul ul{display: block;}
#navi ul li.has-child::before{content:'';position: absolute;margin-top: 37px;margin-left: -16px;width:6px;height:6px;border-top: 2px solid #fff; border-right:2px solid #fff; transform: rotate(135deg);}
#navi li.has-child ul {position: absolute;z-index: 4;background:#004F2B;width:200px;visibility: hidden;opacity: 0;transition: all .3s;}
#navi li.has-child:hover > ul, #navi li.has-child ul li:hover > ul, #navi li.has-child:active > ul, #navi li.has-child ul li:active > ul{ visibility: visible; opacity: 1;}
#navi li.has-child ul li a{color: #fff;border-bottom:solid 1px rgba(255,255,255,0.6); padding: 20px; text-align: left; width: 100%;}
#navi li.has-child ul li:last-child > a{border-bottom:none;}
#navi li.has-child ul li a:hover,
#navi li.has-child ul li a:active{background:#004F2B;}




.box_1 { text-align: center; padding: 60px 0 30px; }
.box_1 h2 img { width: 400px; height: auto; }
.box_1 p { font-family: "Noto Serif JP", serif; font-optical-sizing: auto; font-weight: 400; font-size: 18px; margin-top: 20px; }
.box_1 p span { font-weight: bold; font-size: 22px; color: #b71414; }
.special_bana { text-align: center; padding: 20px 0 100px; }
.box_2 { background-color: #F4F4F4; padding: 60px 0px; }
.box_2 h2 {position: relative; line-height: 1.4; padding: 15px 40px 15px 40px; display: block; text-align: center; margin: -98px auto; width: 410px;  font-size: 32px; font-family: 'Noto Serif JP'; font-weight: 900; background-color: #f4f4f4; color: #004f2b;}
.box_2 h2:before, .box_2 h2:after {  content: ''; width: 20px; height: 30px; position: absolute; display: inline-block;}
.box_2 h2:before { border-left: solid 5px #004f2b; border-top: solid 5px #004f2b; top: 0;  left: 0;}
.box_2 h2:after { border-right: solid 5px #004f2b; border-bottom: solid 5px #004f2b; bottom: 0; right: 0;}

.box_2 .schedule { width: 1000px; margin: 150px auto 0; display: flex; flex-direction: row; flex-wrap: wrap; align-content: space-between; justify-content: flex-start; align-items: flex-start; gap: 20px; color: #535353; }
.box_2 .schedule .item { width: 32%; }
.box_2 .schedule .item h3 { font-size: 18px; font-weight: bold; line-height: 1.5; padding: 5px 0 0; margin: 0; }
.box_2 .schedule .item .photo { line-height: 1px; }
.box_2 .schedule .item .photo img { width: 100%; height: auto; }
.box_2 .schedule .item dl { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; margin: 5px 0; }
.box_2 .schedule .item dl dt { width: 20%; margin: 0; font-weight: bold; font-size: 14px; }
.box_2 .schedule .item dl dd { width: 80%; margin: 0; font-size: 14px; }

.box_3 { width: 1000px; margin: 50px auto 0; padding-bottom: 50px; }
.box_3 h2 { position: relative; padding-bottom: 10px; font-family: 'Noto Serif JP'; font-size: 25px; color: #004f2b; }
.box_3 h2:after {
position: absolute;
content: "";
bottom: 0;
left: 0;
width: 100%;
height: 7px;
background: -webkit-repeating-linear-gradient(-45deg, #97d3b8, #97d3b8 2px, #fff 2px, #fff 4px);
background: repeating-linear-gradient(-45deg, #97d3b8, #97d3b8 2px, #fff 2px, #fff 4px);
}
.box_3 dl { padding: 0; width: 90%; margin: 30px auto 0; }
.box_3 dl dt {}
.box_3 dl dt .date { font-size: 15px; }
.box_3 dl dt h3 { padding: 0; margin: 0; line-height: 1.6; font-size: 20px; font-weight: bold; }
.box_3 dl dd { margin: 0 0 20px; border-bottom: dotted 2px #97d3b8; padding-bottom: 20px; }
.box_3 dl dd p { margin-top: 10px;}
.box_3 dl dd:last-child { border: none; }

.box_4 { background-color: #f4f4f4; width: 100%; padding: 50px 0; }
.box_4 h4 { text-align: center; margin: 0; padding: 0; font-size: 20px; }
.box_4 p { text-align: center; padding: 10px 0; margin: 0; color: red; }
.box_4 ul { padding: 0; margin: 0; display: flex; list-style: none; padding: 0; margin: 0; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: flex-start;}
.box_4 ul li { text-align: center; }
.box_4 ul li img { width: 95%; height: auto; }

.box_5 { padding: 0px 0 50px; }
.box_5 h5 { padding: 0.7em 0.5em; border: 1px solid #333; position: relative; color: #333; text-align: center; width: 300px; margin: 50px auto 32px; font-size: 17px; background-color: #f3f3f3;}
.box_5 h5::before,
.box_5 h5:after { content: ""; display: block; position: absolute; width: 40px; height: 40px; background: #fff;}
.box_5 h5::before { left: -25px; bottom: -25px; border-right: 1px solid #333; transform: rotate(-45deg);}
.box_5 h5::after { right: -25px; top: -25px; border-left: 1px solid #333; transform: rotate(-45deg);}
.box_5 h5::before,.box_5 h5::after { box-sizing: border-box;}
.box_5 ul { display: flex; list-style: none; padding: 0; margin: 0 auto; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; width: 1000px; row-gap: 10px; }
.box_5 ul li { width: 25%; line-height: 1px; }
.box_5 ul li img { width: 96%; height: auto; }



/* TOP CSS  */



#global-nav { display: none; }
#navi { display: none; }

.pc-wrapper { position: relative; font-size: 1.4rem; font-weight: 300; overflow: hidden; min-width: 1200px; }
.top-ticker{ top: 0; left: 0; height: 30px; position: fixed; position: fixed; z-index: 30; height: 25px; width: 100%; background: #D8CBB8; color: #000; }
.bottom-ticker { bottom: 0; left: 0; height: 30px; position: fixed; z-index: 30; height: 25px; width: 100%; background: #D8CBB8; color: #000; }
.sp-wrapper { max-width: 34.40703%;margin: 0 auto; border-left: 2px solid #000; border-right: 2px solid #000; max-width: 470px; background-color: #fff;position: relative; z-index: 10; overflow: hidden; }
.top-lside { position: fixed; z-index: 5; top: 50%; left: 6.36896%; transform: translateY(-50%); display: block; width: 21.44949%; }
.top-lside img { width: 100%; height: auto; }
.top-rside { position: fixed; z-index: 10; top: 50%; right: 4.75842%; transform: translateY(-50%); width: 23.06003%; }
.top-rside ul { list-style: none; padding: 0; margin: 0; }
.top-rside ul li a.btn {
        display: block;
        text-align: center;
        vertical-align: middle;
        text-decoration: none;
        position: relative;
        width: 280px;
        margin: 0 auto 10px;
        padding: 5px;
        font-weight: bold;
        border-radius: 10px;
        color: #27acd9;
        border: 3px solid #27acd9;
        box-shadow: 5px 5px #27acd9;
        transition: 0.3s ease-in-out;
}
.top-rside ul li a.btn:hover {
	box-shadow: none;
	transform: translate(5px, 5px);
	color: #27acd9;
}

.marquee {
  display: flex;
  white-space: nowrap;
  overflow: hidden;
  gap: 1rem;
  font-size: 15px;
}
.marquee-inner {
  animation: marquee 20s linear infinite;
}

@keyframes marquee {
  0%   { translate: 0; }
  100% { translate: calc(-100% - 1rem); }
}

#wrapper { }
#wrapper h1 { text-align: center; padding: 50px 20px 15px; }
#wrapper h1 img {}
#wrapper h1 + p { font-size: 16px; line-height: 1.6; padding: 0 30px 15px; }
#wrapper h2{
    position: relative;
    padding: 15px 20px;
    border-bottom: 3px solid #000;
    width:100%;
    margin: 0 auto;
  font-size: 18px;
}

#wrapper h2:before {
    position: absolute;
    left: 50px;
    bottom: -40px;
    content: '';
    border-width: 20px;
    border-style: solid;
    border-color: #000000 transparent transparent transparent;
  z-index: 1;
}

#wrapper h2:after {
    position: absolute;
    left: 50px;
    bottom: -36px;
    content: '';
    border-width: 20px;
    border-style: solid;
    border-color: #ffffff transparent transparent transparent;
  z-index: 1;
}
  .qf { background-color: aliceblue; padding-top: 5%; padding-bottom: 5%; position: relative; }
  .qf .quiz { font-size: 16px; font-family: "Kosugi Maru"; line-height: 1.5; width: 90%; margin: 7% auto; background-color: #fff; border-radius: 10px; padding: 10px; border: solid 3px rgb(88 162 207 / 80%); }
  .qf .quiz span::before { content: 'psychology_alt'; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20; margin: -37px -33px 0; position: absolute; font-size: 40px;}
  .qf .quiz a { text-decoration: none; }
  .qf .more { text-align: right; margin-right: 23px; }
  .qf .more a { text-decoration: none; font-size: 16px; font-family: "Kosugi Maru"; padding: 2px 14px; background-color:  rgb(88 162 207 / 80%); color: #fff; border-radius: 5px; display: inline-flex; align-items: center; }
  .qf .more a::after { content: "keyboard_double_arrow_right"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-left: 5px; }
  .qf.myq .quiz { margin: 7% auto 0; }
  .qn { background-color: #fde7d7; padding-top: 5%; padding-bottom: 5%; position: relative; }
  .qn .quiz { font-size: 16px; font-family: "Kosugi Maru"; line-height: 1.5; width: 90%; margin: 7% auto; background-color: #fff; border-radius: 10px; padding: 10px; border: solid 3px  rgb(241 163 41 / 80%); }
  .qn .quiz span::before { content: 'psychology_alt'; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20; margin: -37px -33px 0; position: absolute; font-size: 40px;}
  .qn .quiz a { text-decoration: none; }
  .qn .more { text-align: right; margin-right: 23px; }
  .qn .more a { text-decoration: none; font-size: 16px; font-family: "Kosugi Maru"; padding: 2px 14px; background-color: rgb(241 163 41 / 80%); color: #fff; border-radius: 5px; display: inline-flex; align-items: center; }
  .qn .more a::after { content: "keyboard_double_arrow_right"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-left: 5px; }
.box_1 { padding: 10% 0; }
.box_1 .btn a { text-decoration: none; font-size: 23px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color: #a6dfc5; margin: 0 auto; display: block; width: 80%; text-align: center; padding: 10px; border-radius:6px; } 
.box_1 .btn a::after { content: "contract_edit"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: top; margin-left: 5px; }
.box_1 p { padding: 2% 4%; font-size: 20px; }

.qm nav { margin: 20px 0; }
.qf nav,.qn nav {}
.qf nav .pagination,.qn nav .pagination,.qm nav .pagination { display: flex; list-style: none; margin: 0; padding: 0; }
.qf nav .pagination li,.qn nav .pagination li,.qm nav .pagination li { width: 50%; margin: 0; padding: 0; }
.qf nav .pagination li:first-child,.qn nav .pagination li:first-child,.qm nav .pagination li:first-child { text-align: left; padding-left: 5%; }
.qf nav .pagination li:last-child,.qn nav .pagination li:last-child,.qm nav .pagination li:last-child { text-align: right; padding-right: 5%; }
.qf nav .pagination li.disabled,.qn nav .pagination li.disabled {}
.qf nav .pagination li span,.qn nav .pagination li span,.qm nav .pagination li span { text-decoration: none; font-size: 16px; font-family: "Kosugi Maru"; padding: 2px 14px; background-color: rgba(185, 185, 185, 0.8); color: #fff; border-radius: 5px; display: inline-flex; align-items: center; }
.qf nav .pagination li a,.qn nav .pagination li a,.qm nav .pagination li a { text-decoration: none; font-size: 16px; font-family: "Kosugi Maru"; padding: 2px 14px; background-color:  rgb(88 162 207 / 80%); color: #fff; border-radius: 5px; display: inline-flex; align-items: center; }
.qf nav .pagination li:first-child a::before,.qn nav .pagination li:first-child a::before,.qm nav .pagination li:first-child a::before { content: "keyboard_double_arrow_left"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-left: 5px; }
.qf nav .pagination li:last-child a::after,.qn nav .pagination li:last-child a::after,.qm nav .pagination li:last-child a::after { content: "keyboard_double_arrow_right"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-left: 5px; }
.qf nav .pagination li:first-child span::before,.qn nav .pagination li:first-child span::before,.qm nav .pagination li:first-child span::before { content: "keyboard_double_arrow_left"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-right: 5px; }
.qf nav .pagination li:last-child span::after,.qn nav .pagination li:last-child span::after,.qm nav .pagination li:last-child span::after { content: "keyboard_double_arrow_right"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-right: 5px; }

#contents nav { padding: 20px 0; }
#contents nav .pagination { display: flex; list-style: none; margin: 0; padding: 0; }
#contents nav .pagination li { width: 50%; margin: 0; padding: 0; }
#contents nav .pagination li:first-child { text-align: left; padding-left: 5%; }
#contents nav .pagination li:last-child { text-align: right; padding-right: 5%; }
#contents nav .pagination li span { text-decoration: none; font-size: 16px; font-family: "Kosugi Maru"; padding: 2px 14px; background-color: rgba(185, 185, 185, 0.8); color: #fff; border-radius: 5px; display: inline-flex; align-items: center; }
#contents nav .pagination li a { text-decoration: none; font-size: 16px; font-family: "Kosugi Maru"; padding: 2px 14px; background-color:  rgb(88 162 207 / 80%); color: #fff; border-radius: 5px; display: inline-flex; align-items: center; }
#contents nav .pagination li:first-child a::before { content: "keyboard_double_arrow_left"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-left: 5px; }
#contents nav .pagination li:last-child a::after { content: "keyboard_double_arrow_right"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-left: 5px; }
#contents nav .pagination li:first-child span::before { content: "keyboard_double_arrow_left"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-right: 5px; }
#contents nav .pagination li:last-child span::after { content: "keyboard_double_arrow_right"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 24px; vertical-align: middle; margin-right: 5px; }
#contents .more { padding: 20px 0; text-align: center; }
#contents .more a {text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex;  align-items: center; background-color: #7bb6d7; color: #fff; margin: 0 auto;  width: 80%; text-align: center; padding: 10px;  border-radius: 6px; justify-content: center;}

#wrapper.quiz_v { padding-top: 26px; }
#wrapper.quiz_v h1.sec_logo { text-align: center; padding: 25px 10px 0; margin: 0; }
#wrapper.quiz_v h1.sec_logo a { display: block; text-align: center; }
#wrapper.quiz_v h1.sec_logo img { width: 222px; height: auto; }
#wrapper.quiz_v .qq { padding: 0; position: relative; }
#wrapper.quiz_v .qq .quiz { font-size: 16px; font-family: "Kosugi Maru"; line-height: 1.5; width: 90%; margin: 7% auto 0; background-color: #fff; border-radius: 10px; padding: 10px; border: solid 3px rgb(88 162 207 / 80%); }
#wrapper.quiz_v .qq .quiz p::before { content: 'psychology_alt'; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20; margin: -37px -33px 0; position: absolute; font-size: 40px;}
#wrapper.quiz_v h3 { font-weight: bold; padding: 0.5em 1em; border: 3px solid #1c1c1ce6;overflow: hidden; position: relative;background-color:rgb(207 191 166 / 80%);width: 98%;margin: 5% auto 5%; text-align: center; font-size: 21px; }
#wrapper.quiz_v h3::before { content: ''; position: absolute; left: 0; top: 0; border-width: 25px 25px 0 0; border-style: solid; border-color: #1c1c1ce6 #d8cbb9 #1c1c1ce6;}
#wrapper.quiz_v .tab {display: inline-block; margin: 0; padding: 6px 30px; cursor: pointer; background-color: #eee;}
#wrapper.quiz_v .tab.active {  }
#wrapper.quiz_v .tab.fav {font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center;}
#wrapper.quiz_v .tab.fav::before { content: "thumb_up"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 23px; vertical-align: middle; margin-right: 5px; }
#wrapper.quiz_v .tab.fav.active {background-color: rgb(88 162 207 / 80%);color: #fff;}
#wrapper.quiz_v .tab.update {font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center;}
#wrapper.quiz_v .tab.update::before { content: "update"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 23px; vertical-align: middle; margin-right: 5px; }
#wrapper.quiz_v .tab.update.active {background-color: rgb(241 163 41 / 80%);color: #fff;}
#wrapper.quiz_v .content {display: none;}
#wrapper.quiz_v .content.active {display: block;}
#wrapper.quiz_v .content.active.fav { background-color: aliceblue; }
#wrapper.quiz_v .content.active.update { background-color: #fde7d7; }
#wrapper.quiz_v .maker { text-align: right; padding: 5px 24px; font-size: 16px; }
#wrapper.quiz_v .share_q { margin-top: 5%; padding-bottom: 5%; }
#wrapper.quiz_v .share_q h4 { text-align: center; }
#wrapper.quiz_v .share_q h4 { display: flex; justify-content: center; align-items: center; font-weight:bold; text-align: center; font-size: 16px; }
#wrapper.quiz_v .share_q h4::before,
#wrapper.quiz_v .share_q h4::after { content: ''; width: 2px; height: 25px; background-color: #000;}
#wrapper.quiz_v .share_q h4::before { margin-right: 30px; transform: rotate(-35deg)}
#wrapper.quiz_v .share_q h4::after { margin-left: 30px; transform: rotate(35deg)}

#wrapper.quiz_v .anspost {}
#wrapper.quiz_v .anspost a {
  text-decoration: none;
  font-size: 20px;
  font-family: "Kosugi Maru";
  display: inline-flex;
  align-items: center;
  background-color: #a6dfc5;
  display: block;
  width: 90%;
  text-align: center;
  padding: 5px 0 2px;
  border-radius: 6px;
  margin: 20px auto;
}
#wrapper.quiz_v .anspost a::before {
  content: "rate_review";
  font-family: 'Material Symbols Outlined';
  display: inline-block;
  font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20;
  font-size: 29px;
  vertical-align: middle;
  margin-right: 6px;
}

#wrapper.quiz_v .ansbox { border-bottom: dotted 1px; padding-bottom: 5%; }
#wrapper.quiz_v .ansbox .qq .quiz a { text-decoration: none; }
#wrapper.quiz_v .ansbox h4 { text-align: center; font-size: 16px; margin-top: 20px; margin-bottom: 10px; }
#wrapper.quiz_v .ansbox h4 { display: flex; justify-content: center; align-items: center; color: #2589d0;}
#wrapper.quiz_v .ansbox h4::before,
#wrapper.quiz_v .ansbox h4::after { width: 3px; height: 25px; background-color: #2589d0; content: '';}
#wrapper.quiz_v .ansbox h4::before { transform: rotate(-35deg); margin-right: 20px;}
#wrapper.quiz_v .ansbox h4::after { transform: rotate(35deg); margin-left: 20px;}
#wrapper.quiz_v .ansbox .ans_list { width: 95%; margin: 0 auto 5%; padding: 2% 3%; background-color: #E7E7E7; border-radius: 10px;  }
#wrapper.quiz_v .ansbox .ans_list p { font-size: 16px; line-height: 1.8; }
#wrapper.quiz_v .ansbox .ans_list p.udate { font-size: 14px; text-align: right; }
#wrapper.quiz_v .ansbox .ans_list div { font-size: 16px; text-align: center; background-color: #fff; border-radius: 9px; padding: 5px; }


#wrapper.quiz_v .showans {}
#wrapper.quiz_v .showans .ans_list h5 { padding: 0; margin: 10px 0 0 0; font-size: 20px; }
#wrapper.quiz_v .showans .ans_list p { padding: 10px 0;}
#wrapper.quiz_v .showans .btn { text-align: center; margin-bottom: 10px; }
#wrapper.quiz_v .showans .btn span { text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color:#CDCDCD; color: #000; margin: 0 auto; width: 80%; text-align: center; padding: 10px; border-radius: 6px; justify-content: center; }
#wrapper.quiz_v .showans .btn span::before { content: "how_to_vote"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 20px; vertical-align: middle; margin-right: 1vw; }
#wrapper.quiz_v .showans .btn a { text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color:#7bb6d7; color: #fff; margin: 0 auto; width: 80%; text-align: center; padding: 10px; border-radius: 6px; justify-content: center; }
#wrapper.quiz_v .showans .btn a::before { content: "how_to_vote"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 20px; vertical-align: middle; margin-right: 1vw; }
#wrapper.quiz_v .showans .lbtn a {margin: 30px auto 0px ; width: 90%; display: block; font-size: 20px; padding: 10px; background-color: #7bb6d7; color: #fff; border-radius: 5px; font-weight: bold; text-decoration: none; text-align: center; }
#wrapper.quiz_v .showans .share_a {display: flex;justify-content: flex-end;align-items: stretch; padding: 10px 0 0 0; width: 90%; margin: 0 auto; }
#wrapper.quiz_v .showans .share_a h5 {float: left;font-size: 15px;padding: 7px 0 0;margin: 0;} 
#wrapper.quiz_v .showans .share_a ul {width: 50%; list-style: none; padding: 0; display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-around; align-items: center; width: 60%; margin: 0 auto; }
#wrapper.quiz_v .showans .share_a ul li { text-align: center; }
#wrapper.quiz_v .showans .share_a ul li img { width: 75%; height: auto; }
#wrapper.quiz_v .showans .style_share { width: 100%; display: flex; justify-content: space-between; align-items: center; }
#wrapper.quiz_v .showans .style_share .btn { width: 88%; }
#wrapper.quiz_v .showans .style_share .btn a { width: 100% !important; }
#wrapper.quiz_v .showans .style_share .share_a { width: 10%; padding: 0; display: block; line-height: 1px; text-align: center; }
#wrapper.quiz_v .showans .style_share .share_a img { width: 90%; }


#wrapper.quiz_v .share_q ul { list-style: none; padding: 0; display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-around; align-items: center; width: 60%; margin: 0 auto; }
#wrapper.quiz_v .share_q ul li { }
#wrapper.quiz_v .share_q ul li img { width: 100%; height: auto; }
#wrapper.quiz_v .answer { border-bottom: dotted 1px; width: 95%; margin: 0 auto; padding: 5% 0; }
#wrapper.quiz_v .answer ul { list-style: none; padding: 0; margin: 0; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: nowrap; flex-direction: row; }
#wrapper.quiz_v .answer ul li {}
#wrapper.quiz_v .answer ul li:nth-child(1) {font-size: 20px; font-family: "Kosugi Maru";}
#wrapper.quiz_v .answer ul li:nth-child(2) {font-size: 16px;}
#wrapper.quiz_v .answer p { font-size: 20px; font-family: "Kosugi Maru"; padding: 4%; font-weight: bold; border-radius: 10px; margin: 3% 0 3%; background-color: #fff;}
#wrapper.quiz_v .answer .accordion-content p { font-size: 16px; line-height: 1.5; padding: 10px 15px; font-weight: normal; font-family: "Noto Sans JP"; border-radius: 0; margin-top: 0; border: solid 1px #eee; }
#wrapper.quiz_v .accordion-content-wrapper.open .accordion-content p { position: relative; z-index: 1; border-bottom: none; }
#wrapper.quiz_v .accordion-content-wrapper.short .accordion-content p { margin-bottom: 0; }
#wrapper.quiz_v .answer .btn { text-align: center; }
#wrapper.quiz_v .answer .btn span { text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color:#CDCDCD; color: #000; margin: 0 auto; width: 80%; text-align: center; padding: 10px; border-radius: 6px; justify-content: center; }
#wrapper.quiz_v .answer .btn span::before { content: "how_to_vote"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 20px; vertical-align: middle; margin-right: 1vw; }
#wrapper.quiz_v .answer .btn a { text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color:#7bb6d7; color: #fff; margin: 0 auto; width: 80%; text-align: center; padding: 10px; border-radius: 6px; justify-content: center; }
#wrapper.quiz_v .answer .btn a::before { content: "how_to_vote"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 20px; vertical-align: middle; margin-right: 1vw; }
#wrapper.quiz_v .update .answer .btn a {background-color: rgb(241 163 41 / 80%);color: #fff;}

#wrapper.quiz_v .sticky .qq { padding: 0px 0 0; position: relative; }
#wrapper.quiz_v .sticky .qq .quiz { font-size: 20px; font-family: "Kosugi Maru"; line-height: 1.5; width: 90%; margin: 0 auto 0; background-color: #fff; border-radius: 10px; padding: 10px; border: solid 3px rgb(88 162 207 / 80%); }
#wrapper.quiz_v .sticky .qq .quiz p::before { content: 'psychology_alt'; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20; margin: -37px -33px 0; position: absolute; font-size: 40px;}
#wrapper.quiz_v .sticky h3 { text-align: center; margin-top: 46px; margin-bottom: 16px; font-size: 20px; border: none; background-color: #d8cbb8; padding: 0; }
#wrapper.quiz_v h3::before { display: none; }
#wrapper.quiz_v .sticky .maker { text-align: right; padding:10px 30px 10px 0; font-size:17px; }

#wrapper.quiz_v .accordion-section { position: relative;}
#wrapper.quiz_v .accordion-section .infoicon {}
#wrapper.quiz_v .accordion-section .infoicon { font-size: 20px; font-family: "Kosugi Maru"; display: flex; vertical-align: middle; align-items: center;}
#wrapper.quiz_v .accordion-section .infoicon::before { content: "info"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 20px; vertical-align: middle; margin-right: 5px;}
#wrapper.quiz_v .accordion-section  { margin-bottom: 14%; }
#wrapper.quiz_v .accordion-content-wrapper { max-height: 104px; overflow: hidden; position: relative; transition: max-height 0.2s ease-out;}
#wrapper.quiz_v .accordion-content-wrapper::after { content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 4.5em; /* グラデーションの高さ */background: linear-gradient(to bottom, transparent, white);}
#wrapper.quiz_v .accordion-content-wrapper.open::after {background: linear-gradient(to bottom, white, white);}
#wrapper.quiz_v .accordion-content-wrapper.short::after { display: none; }
#wrapper.quiz_v .accordion-content-wrapper.open { max-height: 1000px; /* 十分大きな値に設定 */}
#wrapper.quiz_v .accordion-button { cursor: pointer; text-decoration: none; display: block; width: 40%; margin: -3% auto 0; text-align: center; background-color: #eee; font-size: 16px; padding: 5px; border-radius: 5px; position: absolute; right: 1%; font-weight: 400; }
#wrapper.quiz_v .share_a {display: flex;justify-content: flex-end;align-items: stretch;padding: 4vw 2vw 0 0;}
#wrapper.quiz_v .share_a h5 {float: left;font-size: 16px;padding: 7px 0 0;margin: 0;} 
#wrapper.quiz_v .share_a ul {width: 50%;}
#wrapper.quiz_v .share_a ul li { text-align: center; }
#wrapper.quiz_v .share_a ul li img { width: 90%; height: auto; }
#wrapper.quiz_v .style_share { width: 100%; display: flex; justify-content: space-between; align-items: center; }
#wrapper.quiz_v .style_share .btn { width: 88%; }
#wrapper.quiz_v .style_share .btn a { width: 100% !important; }
#wrapper.quiz_v .style_share .share_a { width: 10%; padding: 0; display: block; line-height: 1px; text-align: center; }
#wrapper.quiz_v .style_share .share_a img { width: 90%; }
#wrapper.quiz_v #stickyElementContainer {position: relative;height: 184px; /* 固定される要素の高さに合わせて設定 */}
#wrapper.quiz_v #stickyElement {position: absolute;width: 466px; margin: 0 auto; transition: top 0.3s ease; /* アニメーションの設定 */}
#wrapper.quiz_v .sticky {position: fixed !important;top: 0;left: 0;right: 0;z-index: 1000;background-color: #d8cbb8;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);}

#wrapper.quiz_v .quiz_v_s {}
#wrapper.quiz_v .quiz_v_s h3 { margin-bottom: 0; }
#wrapper.quiz_v .quiz_v_s .accordion-content-wrapper { max-height: none;}
#wrapper.quiz_v .quiz_v_s .accordion-content-wrapper::after { display: none; }
#wrapper.quiz_v .quiz_v_s .answer { padding-top: 1%; }
#wrapper.quiz_v .quiz_v_s .answer .btn2 { text-align:center; margin-top: 10px; }
#wrapper.quiz_v .quiz_v_s .answer .btn2 a { text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color:#7bb6d7; color: #fff; margin: 0 auto; width: 80%; text-align: center; padding: 10px; border-radius: 6px; justify-content: center; }
#wrapper.quiz_v .quiz_v_s .answer .btn2 a::before { content: "dynamic_feed"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 20px; vertical-align: middle; margin-right: 1vw; }
#wrapper.quiz_v .quiz_v_s .update .answer .btn2 a {background-color: rgb(241 163 41 / 80%);color: #fff;}

#wrapper.quiz_v .quiz_v_s .ans_post { width: 90%; margin: 3% auto; padding-bottom: 10%; }
#wrapper.quiz_v .quiz_v_s .ans_post dl {}
#wrapper.quiz_v .quiz_v_s .ans_post dl dt { padding: 0 0 4px 4px; }
#wrapper.quiz_v .quiz_v_s .ans_post dl dd {}
#wrapper.quiz_v .quiz_v_s .ans_post dl dt label { font-size: 18px; font-weight: bold; }
#wrapper.quiz_v .quiz_v_s .ans_post dl dd textarea { width: 100%; height: 150px; min-height: 150px; border-radius: 10px; font-size: 15px; padding: 12px 14px; }
#wrapper.quiz_v .quiz_v_s .ans_post .lbtn {}
#wrapper.quiz_v .quiz_v_s .ans_post .lbtn input { margin: 10px auto 0; width: 200px; display: block; font-size: 20px; padding: 5px; background-color: #fff; color: #27ACD9; border: #27ACD9 solid 2px; border-radius: 5px; font-weight: bold; }

#wrapper.quiz_v .qgen textarea { width: 100%; height: 150px; min-height: 150px; border-radius: 10px; font-size: 15px; padding: 12px 14px;}

#wrapper.quiz_v .login { height: 100vh; }
#wrapper.quiz_v .login h4 { text-align: center; font-size: 20px; border-bottom: dotted 1px ; margin: 0 20px 20px; padding: 0 0 10px;}
#wrapper.quiz_v .login dl { margin-bottom: 20px;}
#wrapper.quiz_v .login dl dt { font-size: 16px; font-weight: bold; }
#wrapper.quiz_v .login dl dd { font-size: 18px; padding-left: 10px; padding-bottom: 20px; }
#wrapper.quiz_v .login .error { padding-bottom: 10px; color: red; font-size: 16px; text-align: center; }
#wrapper.quiz_v .login .loginbox { width: 90%; margin: 0 auto; }
#wrapper.quiz_v .login .loginbox .lid { padding-bottom: 10px; }
#wrapper.quiz_v .login .loginbox .lid input { width: 100%; padding: 5px; font-size: 18px; }
#wrapper.quiz_v .login .loginbox .lpas { padding-bottom: 10px; }
#wrapper.quiz_v .login .loginbox .lpas input { width: 50%; padding: 5px; font-size: 18px; }
#wrapper.quiz_v .login .loginbox .lbtn {}
#wrapper.quiz_v .login .loginbox .lbtn input { margin: 10px auto 0; width: 200px; display: block; font-size: 20px; padding: 5px; background-color: #fff; color: #27ACD9; border: #27ACD9 solid 2px; border-radius: 5px; font-weight: bold; }
#wrapper.quiz_v .login .loginbox .lpf { font-size: 16px; text-align: right; padding-top: 15px; }
#wrapper.quiz_v .login .registbox { width: 90%; margin: 50px auto; border-top: solid 1px; padding-top: 30px; }
#wrapper.quiz_v .login .registbox .rcom { font-size: 18px; text-align: center; padding-top: 15px; }
#wrapper.quiz_v .login .registbox .rbtn {}
#wrapper.quiz_v .login .registbox .rbtn input { margin: 10px auto 0; width: 200px; display: block; font-size: 20px; padding: 5px; background-color: #fff; color: #27ACD9; border: #27ACD9 solid 2px; border-radius: 5px; font-weight: bold; }
#wrapper.quiz_v .login p { font-size: 16px; padding-top: 20px; }

#wrapper.quiz_v .login .infoedit {}
#wrapper.quiz_v .login .infoedit dl {}
#wrapper.quiz_v .login .infoedit dl dt { font-size: 18px; font-weight: bold; }
#wrapper.quiz_v .login .infoedit dl dd { font-size: 17px; }

#wrapper.quiz_v .kiyaku { }
#wrapper.quiz_v .kiyaku h1 { text-align: center; font-size: 20px; border-bottom: dotted 1px ; margin: 0 20px 20px; padding: 0 0 10px;}
#wrapper.quiz_v .kiyaku p { font-size: 16px; padding-top: 20px; }
#wrapper.quiz_v .kiyaku h2 { margin-top: 20px; }
#wrapper.quiz_v .kiyaku h2 + p { padding: 40px 30px 20px; line-height: 1.6; }
#wrapper.quiz_v .kiyaku h3 + p { padding: 0px 20px 0px; margin: 0; }
#wrapper.quiz_v .kiyaku ul { margin: 0 30px 0 10px; }
#wrapper.quiz_v .kiyaku ul li { font-size: 16px; }
#wrapper.quiz_v .kiyaku ul li ul { list-style:decimal; margin: 10px 0 0 10px; padding: 0; }
#wrapper.quiz_v .kiyaku ul li ul li { font-size: 14px; } 
#wrapper.quiz_v .kiyaku ul + p { padding: 20px 20px 0px; margin: 0; }

#wrapper.quiz_v .contact {}
#wrapper.quiz_v .contact iframe { border: none; width: 90%; margin: 40px auto 0; height: auto; min-height: 700px; display: block; }

#fixedNav { position: fixed; right: 10px; bottom: 10px; }
#fixedNav .post {}
#fixedNav .post a { text-decoration: none; font-size: 20px; font-family: "Kosugi Maru"; display: inline-flex; align-items: center; background-color:#a7dfc6; color: #1c1c1c; margin: 0 auto; width: 100%; text-align: center; padding: 10px 30px; border-radius: 6px; justify-content: center; border: solid 2px #1c1c1c; }
#fixedNav .post a::before { content: "rate_review"; font-family: 'Material Symbols Outlined'; display: inline-block; font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 200, 'opsz' 20; font-size: 29px; vertical-align: middle; margin-right: 6px; }








.footer { text-align: center; background-color: #1A1A1A; color: #fff; padding: 10px; font-size: 13px; }