@charset "utf-8";

/*メルマガ*/
p.merumaga_desc{margin-bottom: 3em; font-size: 110%;}
@media screen and (max-width:960px){
p.merumaga_desc{margin-bottom: 2em; font-size: 100%;}
}
/*ログイン*/
.login_button_wrap{background: #F5F5F5; padding: 2em 1em; margin: 2em auto; max-width: 960px;}
.login_button_wrap.positive{background: #F0F5FE;}
.login_button_wrap>*:last-child{margin-bottom: 0;}
.login_button_wrap .button{font-size: 120%; width: 100%; max-width: 500px;}
@media screen and (max-width:960px){
.login_button_wrap .button{font-size: 110%; max-width: 400px;}
}
/*メルマガ記事と一覧*/
.merumaga_wrap{display: flex; align-items: flex-start; justify-content: space-between; margin: 0 auto 3em;}
article.merumaga{width: 68%; font-size: 18px; margin: 0;}
article.merumaga header{background: #f5f5f5; padding: 1em; margin: 0 auto 2em;}
article.merumaga h1{margin: 0; font-size: 200%;}
article.merumaga .image{display: flex; gap:1em 4%; margin: 1em auto;}
aside.merumaga_index{width: 28%; font-size: 14px;}
aside.merumaga_index h2{font-size: 150%; text-align: center; margin: 0 auto 1em;}
@media screen and (max-width:960px){
.merumaga_wrap{flex-direction: column;}
article.merumaga{width: 100%; font-size: 14px;}
article.merumaga h1{font-size: 160%;}
aside.merumaga_index{width: 100%; margin-top: 4em;}
aside.merumaga_index h2{font-size: 130%;}
}
@media screen and (max-width:440px){
article.merumaga header{padding-left: 10px; padding-right: 10px; margin-left: -10px; margin-right: -10px;}
article.merumaga .image{flex-direction: column;}
}