@charset "UTF-8";

/*
Theme Name: ヨルガオ
Description: ヨルガオ用のWordPressテンプレート
Version: 1.0
Author: Maito OBATA
*/

/* 全体に対する設定 ---------------------------------------- */
* {
    font-family: 'inter', 'noto sans jp', sans-serif;
    scroll-behavior: smooth;
}

main{
    margin-top: 70px;
}

body{
    overflow-x: hidden;
}

a{
    color: inherit;
    text-decoration: none;
}

:root{
    --yorugao_mainBackgroundColor: #f9f9f9;
    --yorugao_mainThemeColor: #c900d8;
    --yorugao_subThemeColor: #e479ec;
    --yorugao_basicTextColor: #383838;
    --yorugao_subTextColor: #555;
}


/* header ---------------------------------------- */
header{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 70px;
    border-bottom: solid .7px #5c5c5c;
    background-color: var(--yorugao_mainBackgroundColor);
    position: fixed;
    margin-top: -70px;
    z-index: 99;
}

.header__container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 95%;
    max-width: 1300px;
    height: auto;
}

.header__logo{
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
}

.header__logo img{
    display: block;
    height: 50px;
    width: auto;
}

.header__keepButton{
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 35px;
    padding: 0 10px;
    border-radius: 8px;
    background-color: var(--yorugao_mainThemeColor);
    color: var(--yorugao_mainBackgroundColor);
    font-size: 13px;
    font-weight: 400;
    transition: .1s;
}

.header__keepButton:hover{
    background-color: #f781ff;
    transition: .1s;
}

.header__keepButton svg{
    display: block;
    width: 18px;
    height: auto;
    fill: #f9f9f9;
    margin-right: 6px;
}

footer{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: auto;
	padding: 30px 0;
	background-color: #555;
}