@import "_variable";
//////////////////////////////////////////////////////////////////
// 要修正
//////////////////////////////////////////////////////////////////

/* 汎用フォントカラー指定 */
.f_red {color: $c_red !important;}
.f_orange {color: #ff6600 !important;}
.f_pink {color: #ef9191 !important;}
.f_blue {color: $c_blue  !important;}
.f_green {color: #dbedc6 !important;}
.f_brown {color: #6d4f2b !important;}
.f_white {color: #fff !important;}

.bg_white { background-color: #fff !important;}
.bg_color01 { background-color: rgba($c_low_main, .3) !important;}
.bg_color02 { background-color: rgba($c_low_main02, .3) !important;}

//////////////////////////////////////////////////////////////////
// 基本修正不要
//////////////////////////////////////////////////////////////////
/* テキスト装飾 */
.bold {font-weight: bold !important;}
.small {
  font-size: 90%;
}
.pad01 {
  padding-left: 1em;
  text-indent: -1em;
}
.pad02 {
  padding-left: 2em;
  text-indent: -2em;
}
.pad03 {
  padding-left: 3em;
  text-indent: -3em;
}

/* テキスト配置 */
.alignC {text-align: center !important;}
.alignL {text-align: left !important;}
.alignR {text-align: right !important;}
.alignJ {text-align: justify !important;}

// ブロック配置
.blockCenter {margin-inline: auto;}

/* padding */
.p0 {padding: 0 !important;}
.p10 {padding: 10rem !important;}
.pt0 {padding-top: 0 !important;}
.pt10 {padding-top: 10rem !important;}
.pt20 {padding-top: 20rem !important;}
.pt30 {padding-top: 30rem !important;}
.pt40 {padding-top: 40rem !important;}
.pb10 {padding-bottom: 10rem !important;}
.pb20 {padding-bottom: 20rem !important;}
.pr0 {padding-right: 0 !important;}
.pr10 {padding-right: 10rem !important;}
.pr20 {padding-right: 20rem !important;}
.pl0 {padding-left: 0rem !important;}
.pl10 {padding-left: 10rem !important;}
.pl20 {padding-left: 20rem !important;}
.pl30 {padding-left: 30rem !important;}
.pl40 {padding-left: 40rem !important;}
.pl50 {padding-left: 50rem !important;}

/* margin */
.m0 { margin: 0 !important;}
.m5 {margin: 5rem !important;}
.m10 {margin: 10rem !important;}
.mt0 {margin-top: 0 !important;}
.mt5 {margin-top: 5rem !important;}
.mt10 {margin-top: 10rem !important;}
.mt20 {margin-top: 20rem !important;}
.mt25 {margin-top: 25rem !important;}
.mt30 {margin-top: 30rem !important;}
.mt80 {margin-top: 80rem !important;}
.mb0 {margin-bottom: 0 !important;}
.mb3 {margin-bottom: 3rem !important;}
.mb5 {margin-bottom: 5rem !important;}
.mb10 {margin-bottom: 10rem !important;}
.mb13 {margin-bottom: 13rem !important;}
.mb15 {margin-bottom: 15rem !important;}
.mb20 {margin-bottom: 20rem !important;}
.mb25 {margin-bottom: 25rem !important;}
.mb30 {margin-bottom: 30rem !important;}
.mb35 {margin-bottom: 35rem !important;}
.mb40 {margin-bottom: 40rem !important;}
.mb50 {margin-bottom: 50rem !important;}
.mb60 {margin-bottom: 60rem !important;}
.mb70 {margin-bottom: 70rem !important;}
.mb80 {margin-bottom: 80rem !important;}
.mb90 {margin-bottom: 90rem !important;}
.ml0 {margin-left: 0 !important;}
.ml5 {margin-left: 5rem !important;}
.ml10 {margin-left: 10rem !important;}
.ml15 {margin-left: 15rem !important;}
.ml20 {margin-left: 20rem !important;}
.ml25 {margin-left: 25rem !important;}
.ml30 {margin-left: 30rem !important;}
.ml40 {margin-left: 40rem !important;}
.ml50 {margin-left: 50rem !important;}
.ml60 {margin-left: 60rem !important;}
.ml70 {margin-left: 70rem !important;}
.mr0 {margin-right: 0 !important;}
.mr5 {margin-right: 5rem !important;}
.mr10 {margin-right: 10rem !important;}
.mr11 {margin-right: 13rem !important;}
.mr15 {margin-right: 15rem !important;}
.mr20 {margin-right: 20rem !important;}
.mr25 {margin-right: 25rem !important;}
.mr30 {margin-right: 30rem !important;}
.mr40 {margin-right: 40rem !important;}
.mr50 {margin-right: 50rem !important;}


/* width */
.w800 {
	width: 95%;
	max-width: 880rem;
	margin: 0 auto;
}

.w1080 {
	width: 95%;
	max-width: 1080rem;
	margin-inline: auto;
}

.w1200 {
	width: 95%;
	max-width: 1200rem;
	margin: 0 auto;
}

/* 画像装飾 */
img {
  &.waku01 {
    border: solid 1rem #ddd;
  }

  &.waku02 {
    padding: 4rem;
    border: solid 1rem #dddddd;
    background: #FFFFFF;
  }
}

.clearfix {
  display: block flow-root;
}

//////////////////////////////////////////////////////////////////
// フェードイン
//////////////////////////////////////////////////////////////////
/*左フェードイン*/
.left-to-right {
  opacity: 0;
  transform: translateX(-20rem);
  transition: all 0.8s;
}
.left-to-right.scrollin {
  opacity: 1;
  transform: translate(0);
}

/*右からフェードイン*/
.right-to-left {
  opacity: 0;
  transform: translateX(20rem);
  transition: all 0.8s;
}
.right-to-left.scrollin {
  opacity: 1;
  transform: translate(0);
}

/*上にフェードイン*/
.down-to-top {
  opacity: 0;
  transform: translateY(20rem);
  transition: all 0.8s;
}
.down-to-top.scrollin {
  opacity: 1;
  transform: translateY(0);
}

/*上にフェードイン*/
.top-to-down {
  opacity: 0;
  transform: translateY(-20rem);
  transition: all 0.8s;
}
.top-to-down.scrollin {
  opacity: 1;
  transform: translateY(0);
}