@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&family=Shippori+Mincho+B1&display=swap');

:root {
	/*フォント*/
	--ff_got: "Hiragino Kaku Gothic ProN","Hiragino Sans","游ゴシック","Yu Gothic",Meiryo,sans-serif;
	/* font-style, font-variant, font-weight, font-size/line-height, font-family */
	--font_min: normal normal 400 100%/1.6 "Shippori Mincho B1", serif;		/*太さ：400のみ*/
	--font_eng1: normal normal 400 100%/1 "Outfit", sans-serif, sans-serif;	/*斜体不可,太さ：100-900使用可能*/
	/*コンテンツ幅*/
	--content_width: 94%;
	/*共通色*/
	--color_base: #564833;
	--color_org: #e29a5f;
	--color_yellow: #e1c679;
	--color_green: #8db698;
	--color_pink: #fcab95;
	--color_cyan: #78ccc0;
	--color_bg1: #f7f6f4;
	--color_bg2: #d0ccc0;
	--color_bg_org: #E29A5F;
	--color_bg_yellow: rgba(225,198,121,0.1);
	--color_bg_green: rgba(141,182,152,0.1);
	--color_bg_pink: rgba(252,171,149,0.1);
	--color_bg_cyan: rgba(120,204,192,0.1);
	/*隙間*/
	--gap_170: 170px;
	--gap_150: 150px;
	--gap_120: 120px;
	--gap_100: 100px;
	--gap_90: 90px;
	--gap_80: 80px;
	--gap_70: 70px;
	--gap_60: 60px;
	--gap_50: 50px;
	--gap_40: 40px;
	
	/*配色：ブログ*/
	--color_dr: #78ccc0;
	--color_orth1: #e1d2ec;
	--color_orth2: #cb9eec;
	/*配色：問診表*/
	--color_kodomo: #e1c679;
	--color_otona: #8db698;
	/*角丸*/
	--radius20: min(20px,2vw);
	--radius40: min(40px,4vw);
	/*背景パターン：下層ディレクトリではパスが繋がらないのでコピペして使用してください*/
	--bg_pattern1: url("../images/pattern1@2x.png") repeat center center / 54px auto;
	/*影*/
	--menu_shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
	--circle_shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
	/*アニメーション*/
	--anim_arrw_hrz: anim_arrow_hrz 0.6s ease-out;
	--anim_arrw_vrt: anim_arrow_vrt 0.6s ease-out;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
:root {
	/*隙間*/
	--gap_170: 14%;
	--gap_150: 12%;
	--gap_120: 10%;
	--gap_100: 8%;
	--gap_90: 8%;
	--gap_80: 7%;
	--gap_70: 6%;
	--gap_60: 5%;
	--gap_50: 4%;
	--gap_40: 4%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
:root {
	/*コンテンツ幅*/
	--content_width: 90%;
	/*隙間*/
	--gap_170: 18%;
	--gap_150: 14%;
	--gap_120: 13%;
	--gap_100: 12%;
	--gap_90: 11%;
	--gap_80: 10%;
	--gap_70: 9%;
	--gap_60: 8%;
	--gap_50: 7%;
	--gap_40: 6%;
	/*角丸*/
	--radius20: 4vw;
	--radius40: 6vw;
}
}