@charset "UTF-8";

/*

UP DATE : 2018年1月31日
全ページ共通の基本設定

*/

/*フォント設定*/
body {
    font-family: -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */
               'Helvetica Neue', /* Macの欧文 (OS X 10.10以前) */
               'Segoe UI',       /* Windowsの欧文 */
               YuGothicM,        /* Windows8.1以上は游ゴシック */
               YuGothic,         /* Macの游ゴシック */
               Meiryo,           /* 游ゴシックが入っていないWindows */
               sans-serif;
}

/* Windows */
@font-face {
  font-family: YuGothicM;
  font-weight: normal;
  src: local('YuGothic-Medium'),  /* Mediumを明示的に指定 */
       local('Yu Gothic Medium'), /* Chrome用 */
       local('YuGothic-Regular'); /* Windows8.1ではMediumがないのでRegularを指定 */
}
@font-face {
  font-family: YuGothicM;
  font-weight: bold;
  src: local('YoGothic-Bold'), /* Boldはそのまま */
       local('Yu Gothic');     /* Chrome用 */
}

/*画像サイズ設定*/
img {
    max-width: 100%;
    height: auto;
}

/*画像トリミング設定*/
.trimming img {object-fit: cover;}

/*リンク設定*/
a {color: #408fc7;}
a img {text-decoration: none;}
a:hover {
    opacity: 0.5;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    text-decoration: none;
}

/*角丸*/
.radius10px {
    border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */ 
}

/*コンテナ*/
#wrap,
.container {
    max-width:1000px;
    margin: 0 auto;
    padding: 0 2%
}
/*--------------------------------------------------------
解像度1024px以上〜PC用設定〜 ここから
--------------------------------------------------------*/
@media only screen and (min-width : 1024px){
    #wrap {
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: space-between;
        justify-content: space-between;
    }
}
/*--------------------------------------------------------
解像度1024px以上〜PC用設定〜　ここまで
--------------------------------------------------------*/

/*FlexBox*/
.flex_start {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
}

.flex_center {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
}

.flex_end {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}

.space_between {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.space_around {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    justify-content: space-around;
}