body{
font-size:74%;
text-align:center;
font-family:'Quattrocento',Meiryo,Osaka;
line-height:1.9;
background: #202f55;
letter-spacing:2.5px;
overflow-y: scroll; 
}

a {
font-size:15px;
color: #000000;
border-bottom: dashed 1px #cccccc;
text-decoration: none;
}

#content a{
position: relative;
padding:3px;
font-size:15px;
background: -webkit-linear-gradient(0deg, #E8CBC0, #636FA4 );
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
border: 0;
}

#content a:hover {
border-bottom: 1px #cccccc dashed;
}

#wrp{
max-width:600px;
margin:0 auto;
padding-top:20px;
}

header{
margin:0 auto;
text-align:center;
}

#nav{
margin:0 auto;
text-align:center;
width: 600px;
height: 35px;
border-radius: 10px;
letter-spacing: 0.5em;
background: linear-gradient(90deg, #E8CBC0, #636FA4 ) ;
}

#nav a{
font-size:15px;
color: #ffffff;
border: 0;
text-decoration: none;
}

#nav a:hover {
border-bottom: 1px #ffffff dashed;
}ul {
list-style: none;
font-size: 15px;
line-height: 1.4;
}

ul:before {
content: "-";
color: #ffffff;
padding-right: 15px;
}

ul:after {
content: "-";
color: #ffffff;
padding-left: 15px;
}

li {
display: inline-block;
position: relative;
padding: 10px;
}

#content{
height:auto;
border:0px;
}

h1 {
font-family: 'Josefin Sans', sans-serif;
font-size:45px;
margin-left:20px;
letter-spacing: 5px;
}

h2{
position: relative;
overflow: hidden;
padding-bottom: 5px;
font-size:20px;
width: 100%;
}
h2::before,
h2::after{
content: "";
position: absolute;
bottom: 0;
}
h2:before{
border-bottom: 3px solid #000000;
width: 100%;
}
h2:after{
border-bottom: 3px solid #cccccc;
width: 100%;
}p {
color: #000;
font-size:14px;
text-align: justify;
text-justify: inter-ideograph;
margin:0;
padding-top:10px;
}

.box{
width:450px;
margin: 0px auto;
padding: 20px;
color:#000;
background:rgba(255,255,255,0.7);　/*自分で追加した*/
text-align:left;
border-bottom: 1px dashed #cccccc;
}
strong {
background: linear-gradient(transparent 75%,#E8CBC0 75% ) ;
}

.box2{
width:580px;
margin:2em 0;
padding:10px;
border-radius: 10px;
background: linear-gradient(90deg, #E8CBC0 , #636FA4) ;
color:#ffffff;
text-align: justify;
text-justify: inter-ideograph;
}

.sam1{
margin:0 auto;
text-align:center;
vertical-align: middle;
width: 550px;
height: 35px;
color:#ffffff;
border-radius: 10px;
letter-spacing: 0.5em;
background: linear-gradient(90deg, #36D1DC, #5B86E5 ) ;
}

.sam2{
margin:0 auto;
text-align:center;
vertical-align: middle;
width: 550px;
height: 35px;
color:#ffffff;
border-radius: 10px;
letter-spacing: 0.5em;
background: linear-gradient(90deg, #3A1C71 0%, #D76D77 50%, #FFAF7B 100% ) ;
}

.sam3{
margin:0 auto;
text-align:center;
vertical-align: middle;
width: 550px;
height: 35px;
border-radius: 10px;
letter-spacing: 0.5em;
color:#ffffff;
background: linear-gradient(90deg, #43C6AC, #F8FFAE ) ;
}.bg_test {
background-image: url(##IMAGE_DATA_1_URL##);
background-repeat:no-repeat;
background-position:100% 100%;
background-attachment:fixed;
}
.box55{
background:rgba(255,255,255,0.8);
text-align:left;
padding-left:2em;
padding-right:2em;
}

.sam4{
border-radius: 10px;
background: linear-gradient(90deg, blue, skyblue, #FFF ) ;
}