@charset "UTF-8";

/* 共通部分
---------------------------------- */

html {
   font-size: 100%;
}

body {
   font-family: "yu Gothic Medium", "游ゴシック Medium", !YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif;
   line-height: 1.7;
   color: #432;
   background-color: #ffe0b6;
}

a {
   text-decoration: none;
}

img {
   max-width: 100%;
}


.wrapper {
   max-width: 1100px;
   margin: 0 auto;
   padding: 0 4%;
}

/* 
------------------------------------------ */

/* タイトル　*/

.page-title {
   font-size: 2rem;
   font-family: 'philosopher', serif;
   text-transform: uppercase;
   font-weight: normal;
   margin-top: 30px;
   margin-bottom: 20px;
   text-align: center;
}


/* 内容
----------------------------------------------- */

/* 内容部分中身 */

.bunsyo {
   width: 700px;
   margin: 0 auto;
   margin-bottom: 50px;
}

.square {
   border: 3px solid #c0c0c0;
   padding: 20px;
   width: 100%;
   border-radius: 10px;
   margin: 10px;
   background-color: #fff;
}

.maru {
   font-size: 1.2rem;
   font-weight: bold;
   color: #82aaaa;
}

.orange {
   color: #f69679;
}


/* 内容部分中身 */

.grid {
   display: grid;
   gap: 26px;
   grid-template-columns: 1fr 1fr 1fr;
   margin-top: 2%;
   margin-bottom: 50px;
}


/* フッター
------------------------------------------------ */
footer {
   background: #432;
   text-align: center;
   padding: 26px 0;
   margin-top: 50px;
}

footer p {
   color: #fff;
   font-size: 0.875rem;
}



/* モバイル版
---------------------------------------------------------------- */

@media(max-width: 600px) {

   .page-title {
     font-size: 2rem;
   }

  .square {
   width: 70%;
}

}