@charset "UTF-8";

/* reset */
*html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
textarea { font-size: 100%; }
hr { display: none; }
a { text-decoration:none; overflow: hidden; outline: none;}

.htmlText,
#htmlTextItemWrap.itemWrap.htmlTextItemWrap.divWrap { width: 100% !important;}
#contents.contents,
.contents,
#topGroupName { width: 100% !important;}

html { scroll-behavior: smooth;}
body     { padding-right: 1em;}
h3       { color: #468d7c; font-size: 1.7em; font-weight: bold; border-bottom: 2px dotted #999; padding-bottom: 0.5em; margin-bottom: ;}
h3 span  { color: #333; font-weight: normal; font-size: 0.7em; margin-left: 1em;}
h4       { font-weight: bold; font-size: 1.35em; color: #468d7c;}

ul       { width: 100%; overflow: hidden;}
ul li a  { width: 49%; float: left; display: block; font-size: 1.2em; background-color: #FFF; padding: 0.5em; text-align: center; color: #333; border-radius: 0.5em; border: 2px solid #e5e5e5; margin-bottom: 1em; box-sizing: border-box;}
ul li a:before { content: "›"; width: 1em; height: 1em; border-radius: 50%; background-color: #ff7800; color: #FFF; display: inline-block; vertical-align: middle; line-height: 1em; font-size: 0.7em; margin-right: 0.5em; margin-bottom: 0.3em;}
ul li:nth-child(even) a  { float: right;}

dt       { font-size: 1.5em; margin-bottom: 0.5em; margin-top: 0.5em; padding-top: 0.5em;}
dl:first-of-type dt       { margin-top: 0; padding-top: 0.5em;}

.item             { background-color: #fef7ea; padding: 0 1em 1.5em; overflow: hidden; border-radius: 1em;}
.item dt      { float: left; margin-right: 1em;}
.item dt img  { width: 250px; height: auto; display: block; border-radius: 0.5em;}
.item dd      { padding-top: 2em;}
.item dd p    { font-size: 1.2em;}
.item dd p a    { display: inline-block; background-color: #61ad68; font-size: 0.8em; padding: 0.5em 1em; text-align: center; color: #FFF; border-radius: 0.5em; border-bottom: 5px solid #408c4b; margin-top: 1em; margin-bottom: 1em; box-sizing: border-box; float: left; margin-right: 1em;}
.item dd div            { overflow: hidden;}
.item dd a.arw          { color: #f66;}
.item dd a.arw:before   { content: "› ";}
.item dd a.arw:hover  { border-bottom: 1px dotted #F66; padding-bottom: 0.3em;}

#q1 dt:before,
#q1-1 dt:before,
#q1-2 dt:before,
#q1-3 dt:before   { content: "Ｑ."; font-weight: bold; font-size: 2em; color: #ff7800;}

#q1-1,
#q1-1-1,
#q1-1-2,
#q1-1-3,
#q1-1-4,
#q1-2,
#q1-2-1,
#q1-2-2,
#q1-2-3,
#q1-2-4,
#q1-3,
#q1-3-1,
#q1-3-2,
#q1-3-3,
#q1-4 { opacity: 0; display: none; transition: 1s;}

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

h3                            { font-size: 3.5vw;}
h3 span                    { font-size: 0.7em; display: block;}
h4                            { font-weight: bold; font-size: 1.1em; color: #468d7c;}

dt                             { font-size: 1.2em; margin-bottom: 0.5em; margin-top: 0.5em; padding-top: 0.5em;}
ul li a                        { font-size: 1em;}
/* ul li:nth-child(even) a { float: right;} */

#q1 dt:before,
#q1-1 dt:before,
#q1-2 dt:before,
#q1-3 dt:before           { content: "Ｑ."; font-weight: bold; font-size: 8vw; color: #ff7800;}

.item dd p                    { font-size: 1em; margin-bottom: 0;}
.item dd p a                 { font-size: 1em; margin-bottom: 0; margin-top: 0.5em; float: none; margin-right: 0; width: 100%; text-align: center;}

.item                           { background-color: #fef7ea; padding: 0 1em 1.5em; overflow: hidden; border-radius: 1em;}
.item dt                       { display: none;}
.item dt img                 { width: 100%; height: auto; display: block; border-radius: 0.5em;}
.item dd                       { padding-top: 1em;}

.item dd div                 { overflow: hidden;}
.item dd a.arw              { color: #f66;}
.item dd a.arw:before   { content: "› ";}
.item dd a.arw:hover     { border-bottom: 1px dotted #F66; padding-bottom: 0.3em;}
}