
/**
 *	The whole of question
 */
#question_wrap {
	display: block;
	position: relative;
	width: 100%;
	margin-bottom: 0.3rem;
    line-height: 1.8 ;

}

/**
 *	Choices block
 */
ul#choices {
	list-style: none;
	margin: 0 !important;
	padding: 0;
	padding-left: 0; 
/*	margin: 0 !important;
	padding: 0;
	padding-left: 10px; */
}
ul#choices li {
	list-style: none !important;
	margin-left: 0;
}
ul#choices li button {
/*	width: 100%; */ 
/*	width: 40%;  */
	padding: 0.3em;
        margin-left: 1.0em;
	margin-bottom: 3px;
        margin-top: 5px ;
	font-size: 1.00rem;
	font-weight: bold;
/*	border-radius: 10px;
	background: #23282d;; */
	border-radius: 10px;
	background: #D4C4B5;
/*	color: #ffffff; */
	color: #785D3D;
        border-color: #E0635D ;
}
ul#choices li button:hover {
/*	background: #0073aa;	*/
	background: #8B6F4E;	
	color: #ffffff; 
	font-weight: bold;
        border-color: #E0635D ;
}

/**
 *	Question block
 */
.yesno_q {
/*	text-align: center;  */
	text-align: left;
	display: block;
	padding: 0.5rem;
	margin-bottom: 0.5rem;
	font-size: 1.00rem;
	font-weight: normal;
	border: 1px #AB7F5E solid;
	border-radius: 10px;
}
.yesno_q dt {
	display: block;
	padding: 0.3rem; 
	margin-bottom: 1.0rem !important;
}
.yesno_q dt span {
	padding: 0.3rem 1.0rem; 
	font-size: 1.0rem;
	font-weight: bold;
/*	background: #A4ECF0;
	color: #318BD4;  */
	background: #C9A97A;
	color: #FAF8F5;   
	border-radius: 10px;
}
.yesno_q dd {
	padding: 0.3rem !important; 
        margin-left: 0.3rem ;
}

/*  */
/*  */


@media (max-width: 767px) {
    body {
        font-size: 12px;     font-weight: 300;
        font-family: 'Noto Sans JP', sans-serif;
        padding-top: 0 !important; 
        background: var(--bg); 
        color: var(--gold);
        text-align: center ;
    }
    .btn { padding: 10px 10px; box-sizing: border-box; }
    .title { font-size: 3.0rem;  font-weight: 800;  color: var(--bzgld) ;} 
    .hd1 { font-size: 2.0rem;  font-weight: 800;  color: var(--bzgld) ; } 
}

@media (min-width: 768px) {
    body {
        font-size: 17px;     font-weight: 300;
        font-family: 'Noto Sans JP', sans-serif;
        padding-top: 0 !important; 
        background: var(--bg); 
        color: var(--gold);
        text-align: center ;
    }
    .btn { padding: 25px 25; box-sizing: border-box; }
    .title { font-size: 4.0rem;  font-weight: 800;  color: var(--bzgld) ; } 
    .hd1 { font-size: 3.0rem;  font-weight: 800;  color: var(--bzgld) ; } 
}


.main {
/*  background-color: #faf8f5; */
    margin-top: 0; /* タイトル上の余白 */
    padding-top: 0;
}
.main-txt {
    margin-left: 20px ;
    margin-right: 20px ;
    line-height: 1.8 ;

}
  .btn-rose {
    background: var( --divider) ;
    padding: 10px 10px;
    color: var(--white); 
    font-weight: bold;
    border-radius: 10px; 
    text-decoration: none;
  }
  .btn-rose:hover { 
    background: var(--gold) ;
    color: var(--white); 
 }

.article h1 {
    margin-top: 0; /* タイトル上の余白 */
    padding-top: 0;
}

.content {
    margin-top: 0; /* コンテンツ全体の上の余白 */
}


.img-cover {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  :root {
    --bg: #FAF8F5;
    --dark: #2C2C2C;
    --gold: #8B6F4E;
    --gold-light: #C9A97A;
    --rose: #C4A69D;
    --muted: #8A8A8A;
    --white: #FFFFFF;
    --panel: #F0EBE3;
    --divider: #D4C4B5;
    --bzgld: #8B7355 ;
    --cocob: #6F543A ; 
}

  html { scroll-behavior: smooth; }

  body {
    background: var(--bg);
    color: var(--dark);
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 300;
    overflow-x: hidden;
    text-align: center ;
  }

/*  */
