@charset "UTF-8";

*{
    margin: 0;
padding: 0;
}
.textgray {
    color: rgba(62,102,174,1.00);
}
.boxGreen  img {
    vertical-align: middle;
}
.puaplebig {
    color: rgba(152,65,183,1.00);
    font-size: 1.2em;
}
.f-right {
    float: right;
    margin-left: 20px;
}
.f-left {
    margin-right: 20px;
    float: left;
}
.plof {
    font-size: 0.9em;
    border-bottom: thin solid #976A00;
    padding-bottom: 3%;
}
.valign img{
	margin-right:10px;
	vertical-align: middle;
}
.valign span{
	vertical-align: middle;
}

.pagetop {
    display: none;
    position: fixed;
    bottom: 10px;
    right: 3%;
    margin-bottom: 10px;
    border-radius: 35px;        /* CSS3草案 */
    -webkit-border-radius: 35px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 35px;
    line-height: 100%;
}
.pagetop a {
    display: block;
    background-color: #D37DDE;
    text-align: center;
    color: #222;
    text-decoration: none;
    padding: 7px;
    border-radius: 50px;        /* CSS3草案 */
    -webkit-border-radius: 50px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 50px;   /* Firefox用 */
    opacity: 0.6;
}
 
.pagetop a:hover {
    display: block;
    background-color: #D66EE7;
    text-align: center;
    color: #fff;
    text-decoration: none;
    padding: 7px;
    border-radius: 50px;        /* CSS3草案 */
    -webkit-border-radius: 50px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 50px;   /* Firefox用 */
    opacity: 0.3;
}

.whitebox {
    width: 90%;
    height: auto;
    background-color: rgba(255,254,233,1.00);
    padding-top: 2%;
    padding-right: 5%;
    padding-bottom: 5%;
    padding-left: 5%;
    -webkit-box-shadow: 5px 7px 10px rgba(181,180,180,0.58);
    box-shadow: 5px 7px 10px rgba(181,180,180,0.58);
}
.bg_green {
    background-color: rgba(143,200,161,1.00);
    border-radius: 5px;
    width: 20%;
    color: rgba(255,255,255,1.00);
    font-weight: bold;
    text-align: center;
    font-size: medium;
    line-height: 160%;
}
.greenbox {
    background-color: rgba(185,116,227,1.00);
    color: rgba(255,255,255,1.00);
    padding-top: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-left: 15px;
    border-radius: 7px;
    margin-bottom: 20px;
}
#message {
    background-color: rgba(255,249,235,1.00);
    padding-top: 5%;
    padding-right: 5%;
    padding-bottom: 5%;
    padding-left: 5%;
    font-family: "ヒラギノ明朝 ProN W3", "Times New Roman", serif;
}
.bg_puaple {
    background-color: rgba(218,144,229,1.00);
    border-radius: 5px;
    width: 20%;
    color: rgba(255,255,255,1.00);
    font-weight: bold;
    text-align: center;
    font-size: medium;
    line-height: 160%;
}
.bg_greenpeal   {
    background-color: rgba(245,255,241,1.00);
    border-radius: 5px;
    padding: 10px;
    text-align: left;
    width: auto;
    font-size: medium;
    line-height: 160%;
}
.bg_puaplepeal   {
    background-color: rgba(254,241,255,1.00);
    border-radius: 5px;
    padding: 10px;
    text-align: left;
    width: auto;
    font-size: medium;
    line-height: 160%;
}
.text11 {
    font-size: 1.1em;
}
.text12 {
    font-size: 1.2em;
}

.text14 {
    font-size: 1.4em;
}
.textgold {
    color: rgba(175,122,0,1.00);
}
.text15 {
    font-size: 1.6em;
}
.mosgreen {
	color: rgba(62,140,75,1.00);
}
.mosgreen2 {
	color: rgba(62,121,101,1.00);
	font-size: medium;
}
.Orangeround {
    border: thin solid #FF7400;
    border-radius: 15px;
    padding-top: 7px;
    padding-right: 7px;
    padding-left: 7px;
    padding-bottom: 5px;
    margin-bottom: 20px;
}
#QA .h4 {
	width: 94%;
	background-color: rgba(119,179,124,1.00);
	color: rgba(255,255,255,1.00);
	padding: 2px 3%;
	border-radius: 10px;
}
#QA h4{color: #fff;}
.dropcap:first-letter {
	font-size: 60px;/*文字の大きさ*/
	margin-right: 6px;
	margin-top: 6px;
	float: left;
	line-height: 1;/*必要*/
	font-family: "Times New Roman", Times, "serif";
	color: rgba(51,127,59,1.00);
}
.cap {
    font-size: medium;
}
.red {
    color: rgba(208,48,184,1.00);
}

.inyou {
    font-family: "Times New Roman", Times, serif;
    font-size: 1.3em;
    font-style: italic;
    color: #515050;
    line-height: 200%;
}
.linegreen {
font-weight: bold;
	background: linear-gradient(transparent 60%, #dcff96  60%);
	font-weight: bold;
}
.effect4
{
  position: relative;
}
.effect4:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 0px;
  right: 0px;
  left: auto;
  width: 80%;
  top: 100%;
  max-width:800px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
}
h3 {
   font-family: dnp-shuei-nshogomincho-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 2em;
    text-align: center;
    color: rgba(146,66,194,1.00);
    line-height: 160%;
    font-feature-settings: "palt"1;
}
.voistitlle {
    background-color: rgba(191,226,153,1.00);
    border-radius: 50px;
    color: rgba(255,255,255,1.00);
    line-height: 160%;
    padding-bottom: 10px;
    padding-top: 10px;
    width: 90%;
    margin-right: auto;
    margin-left: auto;
}
.voistitlle h3 {
    color: rgba(255,255,255,1.00);
    line-height: 120%;
    padding-top: 10px;
    padding-bottom: 10px;
}
h4 {
    font-size: 1.3em;
    font-family: kozuka-gothic-pro, sans-serif;
    font-weight: 300;
    font-variant: normal;
    font-style: normal;
    color: rgba(226,113,31,1.00);
    line-height: 200%;
    font-feature-settings: "palt"1;
}
.shadow {
    -webkit-box-shadow: 0px 0px 10px rgba(134,133,133,0.73);
    box-shadow: 0px 0px 10px rgba(134,133,133,0.73);
}
.boxGreen {
    background-color: #BE90DA;
    color: #FFFFFF;
    text-align: left;
    padding-top: 2%;
    padding-right: 3%;
    padding-left: 3%;
    padding-bottom: 2%;
    font-family: adobe-garamond-pro, serif;
    font-weight: 600;
    font-style: normal;
    font-size: 2em;
    vertical-align: middle;
    line-height: 0%;
}
.boxbeage {
    background-color: #FBFAF2;
    padding: 3% 3% 5% 5%;
}
.vois {
    width: 90%;
    max-width: 900px;
    height: 300px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 10px;
    -webkit-box-shadow: inset 0px 0px 10px 0px rgba(183,179,179,0.89);
    box-shadow: inset 0px 0px 10px 0px rgba(183,179,179,0.89);
    overflow: auto;
    padding-top: 5%;
    padding-right: 5%;
    padding-bottom: 5%;
    padding-left: 5%;
    background-color: rgba(255,255,255,1.00);
    font-size: 0.9em;
    line-height: 180%;
}
.text-green {
    color: #327839;
}
body {
    font-family: kozuka-gothic-pro, sans-serif;
    font-weight: 300;
    font-variant: normal;
    font-style: normal;
    font-size: 1.3em;
    line-height: 200%;
    width: 100%;
    color: #333333;
    position: relative;
}
body::after {
  content: "";
  width: 100vw;
  height: 100vh;
  background-image: url("../image/whiteBG.jpg");
  background-size: cover;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: -1;
}
.wrapper{
    width: 84%;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    background-image: url(../image/001-Basik-Paper.png);
    background-repeat: repeat-y;
    background-size: 100% auto;
    padding-top: 4%;
    padding-right: 4%;
    padding-left: 4%;
    padding-bottom: 4%;
    box-shadow: 0px 0px 12px rgba(167,167,167,0.60);
    -webkit-box-shadow: 0px 0px 12px rgba(167,167,167,0.60);
}

header{
    text-align: center;
    background-image: url(../image/CristalAscensionBG.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
}
.center{
    text-align: center;
}
.h2div {
    background-color: rgba(159,194,144,0.77);
    padding-top: 2%;
    padding-right: 5%;
    padding-bottom: 2%;
    padding-left: 5%;
    color: #FFFFFF;
}
.h2div h2 {
    color: #FFFFFF;
}
h2 {
    font-family: dnp-shuei-nshogomincho-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 2em;
    line-height: 160%;
    color: #947F00;
    text-align: center;
    font-feature-settings: "palt"1;
}
.text13{
    font-size: 1.3em;
}
.text12{
    font-size: 1.2em;
    line-height: 200%;
}
.h3line {
    padding-top: 30px;
    padding-bottom: 30px;
    border-top: thin solid #4C9D56;
    border-bottom: thin solid #4C9D56;
}
#pen {
    background-image: url(../image/pen.png);
    background-repeat: no-repeat;
    background-position: right 0%;
}
.phone_area{
  display:none;
}
.osusume {
    border: thin solid rgba(185,116,225,1.00);
    border-radius: 5px;
    padding-top: 3%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 3%;
    padding-bottom: 3%;
    padding-left: 3%;
    width: 90%;
    max-width: 660px;
    line-height: 230%;
}
.h3mincho {
    font-family: dnp-shuei-nshogomincho-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 1.5em;
    padding-bottom: 10px;
    margin-bottom: 10px;
    line-height: 180%;
    font-feature-settings: "palt"1;
    text-align: center;
}
.spnone{display: block;
    }
 .pcnone{display: none;
    }

@media screen and (max-width:480px){
    body {font-size: 1.1em; }
    h2 {
    font-size: 1.5em;
}
    .boxGreen{text-align: center;
    font-size: 1.2em;
    line-height: 120%;
    padding-bottom: 2%;}
    .h3mincho{font-size: 
    1.1em;}
    h3 {
    font-size: 1.2em;
}
header{
    text-align: center;
    background-image: url(../image/CristalAscensionBG.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    width: 100%;
    min-height: 90vh;
    padding-top: 10%; 
    }
    
    .phone_area{
    display:block;
  }
    .puaplebig {font-size: 
    1.1em;}
    
    .voistitlle{width: 100%;
        
    }
    .textgray{font-size: small;
    line-height: 160%;}
    
    .text13{
    font-size: 1.2em;
}
    .text15{
     font-size: 1.3em;
}
    .spnone {display: none;
    }

    .pcnone {display: block;
    }

}
