body{margin:0; }

#guide{
margin:50px 0 100px 5%;
display: flex;
background:#FFFFFF;
width:90%;
}

.guide_block{width:70%;}


/*　　目次欄　　*/
.language{
display: flex;
justify-content: space-between;
width:20rem; margin-bottom:1rem;
}

.language a{
color:#333; transition:0.2s;
}

.language a:hover{
transform: translateX(-2px);
text-shadow: 0px 10px 5px rgba(0,0,0,0.2);
}

.item{
background:#FFFFFF; 
padding:1rem 0 1rem 1rem;
}

.item a{ text-decoration: none; display: block;}

.item_contents {
font-size:1.2rem; margin-bottom:1rem;
border-bottom:solid 0.5px #666666;
}

.item_block{display: flex; justify-content: stretch; }

.item_01{color: #59B1E0;}
.item_02{color: #FE2E9A;}
.item_03{color: #965AB5;}
.item_04{color: #0174DF;}
.item_05{color: #86B404;}

.item .head{
font-size:1.1rem; font-weight:600;
margin:0.5rem 0 0.5rem 1rem;
display: inline-block;  transition:.3s;
}

.item .section{
font-size:0.9rem;
color:#444444;
margin-left:2rem;
transition:0.3s;
display: inline-block;
position:relative;
}



.item .head:hover{
transform: translateX(-5px);
text-shadow: 0px 10px 5px rgba(0,0,0,0.2);
filter: brightness(120%);
}


.item .section:hover{
color:#AAAAAA;
}

.item .section:before,
.item .section:after{
  position: absolute;
  top: 1.5em; content: "";
  display: inline-block;
  width: 0; height: 0.5px; 
  background: #AAAAAA;
  transition: 0.25s ease-out;
}

.item .section:before{left: 50%;}
.item .section:after{right: 50%;}

.item .section:hover:before,
.item .section:hover:after{width: 50%;}








/*　　　block 共通部分　　　*/

.one_block/*一つのブロック要素*/{
margin-top:3rem;
background:#FFFFFF;   
padding-bottom:5rem;  
box-shadow:0px 0px 10px rgba(0,0,0,0.4);
border-radius:10px;
}

.title/*タイトルの設定*/{
margin:auto 5% 0 5%;
padding:2.5rem 0 1rem 0;
width:90%;  font-weight:600;
width:50%; margin-left:10%;
display: flex; flex-wrap: wrap;
justify-content: space-between;  
align-items: flex-end;
}

.block_head {
color:#FFFFFF;
padding:2rem 0px 1.3rem 2rem;
box-shadow: 0px 4px 10px rgba(0,0,0,0.2);  
font-size:1.2rem;
}

.block_head:before{content: "■ ";    }
.matter{ margin: 1.5rem 0 1.5rem 10%; position: relative;
　　　　　display:flex;}


/*本文中の要素*/ /*　文字装飾　*/
.border{background: linear-gradient(transparent 90%, #ffcc99 90%);}
.border_blue{background: linear-gradient(transparent 90%, #A9E2F3 90%);border-radius:1px;}/*span*/
.border_purple{background: linear-gradient(transparent 90%, #D0A9F5 90%);border-radius:1px;}/*span*/
.border_red{background: linear-gradient(transparent 95%, #FA5858 95%);border-radius:1px;}/*span*/

.matter_block_n{
border-left:solid 7px #59B1E0;
padding-left:1rem; margin:1rem 0;
font-size:1.15rem;
}

.note{font-size:0.85rem;
color:#666; margin-left:1rem;}

.in-note{font-size:0.7rem; color:#666; margin:0 0.3rem;}

.note-rink{
text-decoration: none;
color:dodgerblue;
}

.list{
background: #FB65A6;
text-align: center;
padding:0.5rem 2rem;
margin:2rem 1rem;
color:#FFF; border-radius:1rem;
text-decoration: none;
transition: 0.3s;
}

.list:hover{
opacity:0.9;
box-shadow:0 5px 5px rgba(0,0,0,0.2);
}


/* 右または下に表示されるリンク */
.delighter .out{
z-index:-1; display:none;}

.delighter.started .out{
z-index:1; display:block; position:fixed; 
bottom:25%; right:7%;
animation: show 0.2s ease-out;}

@keyframes show{
from{opacity: 0;}
to{opacity: 1;}}

.delighter.started.ended .out{
display:none; z-index:-1;}



.sale-a{
right:10%; position:absolute;
bottom:0rem;width:14rem;
text-align: center;
text-decoration: none;
color:#FFFFFF; padding:0.7rem 1.5rem;
border-radius:5px;
transition:0.3s;
}

.sale-a:hover{
transform: translateY(-5px);
box-shadow: 0px 5px 15px rgba(0,0,0,0.3);
}

.out_fantia{background:#F636A9;}
.out_pro{background:#86B404;}
.out_DL{background:#3B6AE1;}





/*　 Normal plan　*/
.Normal_plan_name{font-size:1.6rem; color:#59B1E0;}
.Normal_amount{font-size:1.3rem; color:#59B1E0;}
.n{background: #59B1E0;}
    
.Normal_border{border-bottom:solid 1.5px #59B1E0; width:90%; margin-left:5%;}

.present{
text-decoration: none;
color:#FFF; background:#fa5858;
padding:1rem 5rem;
border-radius:2rem;
transition: 0.3s;
}

.present:hover{
transform: translateY(-5px);
box-shadow: 0px 5px 15px rgba(0,0,0,0.3);}
}


/*　　　Special Plan　　　*/
#special_title{color:#FB65A6;}
.special_plan_name{font-size:1.6rem; color:#FB65A6;}
.special_amount{font-size:1.3rem; color:#FB65A6;}
.s{background: #FB65A6;}
.special_border{border-bottom:solid 1.5px #FB65A6; width:90%; margin-left:5%;}


/*　　　Next Plan　　　*/
.next_plan_name{font-size:1.6rem; color:#965AB5;}
.next_amount{font-size:1.3rem; color:#965AB5;}
.ne{background: #965AB5;}

.next_border{border-bottom:solid 1.5px #965AB5; width:90%; margin-left:5%;}

/*　　　Next Plan　　　*/
.sale_plan_name{font-size:1.6rem; color:#0174DF;}
.next_amount{font-size:1.3rem; color:#965AB5;}
.ne{background: #965AB5;}

.next_border{border-bottom:solid 1.5px #965AB5; width:90%; margin-left:5%;}

/*　　　Soryuu4 Product　　　　*/
.product_plan_name{font-size:1.6rem; color:#0174DF;}
 .product_border{border-bottom:solid 1.5px #0174DF; width:90%; margin-left:5%;}

.p{background: #0174DF;}

/*　　　Overview　　　　*/
.sale_plan_name{font-size:1.6rem; color:#86B404;}
 .sale_border{border-bottom:solid 1.5px #86B404; width:90%; margin-left:5%;}

.sa{background: #86B404;}


/*　　　　　外部リンク　　　　*/

.out_n{background: #59B1E0;    }
.out_s{background: #FB65A6;}
.out_ne{background: #965AB5;}
.out_p{background:#0174DF;}

.out{
width:14rem;
text-align: center;
text-decoration: none;
color:#FFFFFF; padding:0.7rem 1.5rem;
border-radius:5px;
transition:0.3s;
}

.out:hover{
transform: translateY(-5px);
box-shadow: 0px 5px 15px rgba(0,0,0,0.3);}
}