@import '_config';
@import '_common';


/* ここからページごとのスタイルを定義 */

/*
----------------------------------------
size
----------------------------------------
*/
$sp-max-width: 750px; //SPデザイン最大幅
$inner-max-width: 940px; //インナー最大幅

$breakpoints: (
	'sp': 'screen and (max-width: #{$sp-max-width})',
	'tab': 'screen and (max-width: #{$inner-max-width})',
	'pc': 'screen and (min-width: #{$inner-max-width + 1px})',
);

/*
----------------------------------------
function
----------------------------------------
*/

// メディアクエリー
@mixin mq($breakpoint: sp) {
	@media #{map-get($breakpoints, $breakpoint)} {
		@content;
	}
}

/*
----------------------------------------
共通
----------------------------------------
*/
.pc-only {
	display: block;

	@include mq('sp') {
		display: none;
	}
}

.sp-only {
	display: none;

	@include mq('sp') {
		display: block;
	}
}