/********************************************************
 *	PC高解像度用メディアクエリ
 *******************************************************/
@media screen and (min-width: 1081px) {

    /* ボディー構成 */
    body {    
        background-color : #6e6e6e;
        margin: 0;
    }
    
    /* センタリング用ラッパ */
    .wrapper {
        font-family : "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", sans-serif;
		font-size : 16px;
        color: white;
		line-height: 1.4;
		min-width: 500px;
		max-width: 900px;
		margin-left: auto; 
		margin-right: auto;
		padding: 0px;
		text-align: left;
		position: relative;
		border: solid 0px;
	}    

    /* トップページ背景 */
    .toppage {
        background-image : url("../images/tsuta.gif");
        background-repeat : no-repeat;
        background-position :60% 0;
    }

    .entrance {
        background-image : url("../images/flower.gif");
        background-repeat : no-repeat;
        background-position : 90% 300px;
    }
    
    .dolphin {
        background-image : url("../images/w_stand/dolphin.jpg");
        background-repeat : no-repeat;
        background-position : 60% 150px;
    }
    .dolphin2 { float: left; }
    
    #wrapper img { cursor: pointer;}  /* 指 */

    /* リンクカラー */
    A:link     { color:#f0980f; }
    A:visited  { color:#f0980f; }
    A:hover    { color:yellow;  }

	/* ボタンの表示 */
	.right_button {
		margin-top: 5px;
		margin-bottom: 15px;
		margin-left: 5px;
		background-color: #888888; 
		color: #dddddd; 
		float: right;
		font-weight: bold; 
		height: 22px; 
		width: 100px; 
		text-align: center; 
		line-height: 1.0;

        /* 追加：角を丸くする */
        border-radius: 20px;        /* 値を大きくすると丸くなる */		

        /* 内側のオーバル枠（ここがポイント） */
        box-shadow: inset 0 0 0 2px #999;
  	}

	.left_button {
		margin-top: 5px;
		margin-bottom: 15px;
		margin-left: 5px;
		background-color: #888888; 
		color: #dddddd; 
		float: left;
		font-weight: bold; 
		height: 22px; 
		width: 100px; 
		text-align: center; 
		line-height: 1.0;

        /* 追加：角を丸くする */
        border-radius: 20px;        /* 値を大きくすると丸くなる */		

        /* 内側のオーバル枠（ここがポイント） */
        box-shadow: inset 0 0 0 2px #999;
   	}

    /* 左右にボタンが有る場合、2つのボタンを線で結ぶ */
    .button-line {
        display: flex;
        align-items: center;
    }
    /* 2つのボタンをつなぐ線 */
    .line {
        flex-grow: 1;             /* ← 空いたスペースをすべて埋める */
        height: 1px;              /* 線の太さ */
        background: #888;         /* 線の色 */
        margin: 0 0 8px 0;           /* ボタンとの間隔 */
    }
    
    /* image 用ボックス */
    .imgl {
		float: left;
		margin-top: 20px;
		margin-right: 1em;
		margin-bottom: 20px;
        text-align: left;
    }
	.imgr {
		float: right;
		margin-top: 20px;
		margin-left: 1em;
		margin-bottom: 20px;
        text-align: left;
	}
	.imgn {
		margin-top: 20px;
		margin-bottom: 20px;
        text-align: left;
	}
    
    /* タイトル位置調整用スペース */
    .space_top {
        width: 617px;
        height: 228px;
    }
    .space_bottom {
        width: 600px;
        height: 300px;
    }
    
    /* タイトルフリガナ位置 */
    .furigana {
        font-size: 12px;
        color: #f0980f;
    }    
    
    /* ブログタイトル */
    .blog_title {
        width: 400px;
    }

    /* ブログアイコンイメージ */
    .blog_image {
        width: 300px;
        position: absolute;
        top: 350px;
        left:300px;
    }

    /************* Entrance *************/
    .gallery {
        width: 90px;
        margin-right: 2em;
    }
    
    .organizer_list {
        float: left;
        width: 70%;
        padding: 0 0 0 0;
        margin-top: -1em;
    }

    .left_pane {
        float: left;
        width: 30%;
    }
    .right_pane {
        float: left;
        width: 69%;
    }

	dl {
		display: flex;
		flex-wrap: wrap;
		border-top; none;
		text-align: left;
		padding: 2px;
	}
	dt.dt {
		vertical-align: middle;
		width: 18%;
		padding: 2px;
		box-sizing: border-box;
	}
	dd.dd1 {
		vertical-align: middle;
		width: 20%;
		padding: 2px;
		margin: 0;
		box-sizing: border-box;
	}
	dd.dd2 {
		vertical-align: middle;
		width: 62%;
		padding: 2px;
		margin: 0;
		box-sizing: border-box;
	}
	dd.dd3 {
		vertical-align: middle;
		width: 82%;
		padding: 2px;
		margin: 0;
		box-sizing: border-box;
	}

    .memory5 {
        float: left;
        margin-left: 50px;
    }
    .taisho {
        float: left;
        margin-left: 10%;
    }

    /************** Slarry **************/

    .slarry_title {
        font-face: "ＤＦＰPOP1体W9,ＭＳ Ｐゴシック";
        font-size: 24pt;
        color: #fc710a;
    }
    .upper_line {
        border-top: solid 2px white;
        width: 55%;
        height:10px;
    }
    .lower_line {
        border-bottom: solid 2px white;
        width: 55%;
        height:10px;
    }

    .slarry_wrap {
        display: flex;
        justify_content: space-between;
    }
    .slarry_menu {
        float: left;
        width: 32%;
        text-align: center;
    }
    .slarry_icon {
        float: left;
        text-align: center;
        margin-right: 10%;
    }
    .slarry_book {
        float: right;
        text-align: left;
        width: 20%;
    }

    .slarry_img  {
        margin-left: 20%;
        margin-right: 20%;
        width:60%;
    }
    .slarry_img1 { 
        width: 40%;
        margin-left: 30%;
        margin-right: 30%;
        margin-top: -15%;    
    }


}

/********************************************************
 *	スマートフォン高解像度用メディアクエリ
 *******************************************************/
@media screen and (max-width: 1080px) {

    /* ボディー構成 */
    body {
        background-color : #6e6e6e;
        margin: 0 0 0 0;
    }
    
    /* センタリング用ラッパ */
    .wrapper {
        font-family : "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", sans-serif;
		font-size : 16px;
        color: white;
		line-height: 1.4;
		min-width: 300px;
		max-width: 100%;
		margin-left: 2%; 
		margin-right: 2%;
		padding: 0px;
		text-align: left;
		position: relative;
		border: solid 0px;
	}

    /* トップページ背景 */
    .toppage {
        background-image : url("../images/tsuta.gif");
        background-repeat : no-repeat;
        background-position :90% 0;
        background-size: 100%;
    }

    .entrance {
        background-image : url("../images/flower.gif");
        background-repeat : no-repeat;
        background-position :100% 130px;
    }
    
    .dolphin {
        background-image : url("../images/w_stand/dolphin.jpg");
        background-repeat : no-repeat;
        background-position : 0 250px;
        background-size: 100%;
    }
    .dolphin2 {
        width: 30%;
        float: right;
    }
    
    #wrapper img { cursor: pointer;}  /* 指 */

    /* リンクカラー */
    A:link     { color:#f0980f; }
    A:visited  { color:#f0980f; }
    A:hover    { color:yellow;  }

	/* ボタンの表示 */
	.right_button {
		margin-top: 5px;
		margin-bottom: 15px;
		margin-left: 5px;
		background-color: #888888; 
		/*border: 3px outset rgb(170, 136, 51); 
		border: 3px outset #777777; */
		color: #dddddd; 
		float: right;
		font-weight: bold; 
		height: 22px; 
		width: 100px; 
		text-align: center; 
		line-height: 22px;

        /* 追加：角を丸くする */
        border-radius: 20px;        /* 値を大きくすると丸くなる */		

        /* 内側のオーバル枠（ここがポイント） */
        box-shadow: inset 0 0 0 2px #999;
  	}

	.left_button {
		margin-top: 5px;
		margin-bottom: 15px;
		margin-left: 5px;
		background-color: #888888; 
		/*border: 3px outset rgb(170, 136, 51); 
		border: 3px outset #777777; */
		color: #dddddd; 
		float: left;
		font-weight: bold; 
		height: 22px; 
		width: 100px; 
		text-align: center; 
		line-height: 22px;

        /* 追加：角を丸くする */
        border-radius: 20px;        /* 値を大きくすると丸くなる */		

        /* 内側のオーバル枠（ここがポイント） */
        box-shadow: inset 0 0 0 2px #999;
   	}

    /* 左右にボタンが有る場合、2つのボタンを線で結ぶ */
    .button-line {
        display: flex;
        align-items: center;
    }
    /* 2つのボタンをつなぐ線 */
    .line {
        flex-grow: 1;             /* ← 空いたスペースをすべて埋める */
        height: 1px;              /* 線の太さ */
        background: #888;         /* 線の色 */
        margin: 0 0 8px 0;           /* ボタンとの間隔 */
    }
    

    /* image 用ボックス */
    .imgl {
		float: left;
		margin-top: 20px;
		margin-right: 1em;
		margin-bottom: 20px;
    }
	.imgr {
		float: right;
		margin-top: 20px;
		margin-left: 1em;
		margin-bottom: 20px;
	}
	.imgn {
		margin-top: 20px;
		margin-bottom: 20px;
	}
    
    /* タイトル位置調整用スペース */
    .space_top {
        width: 600px;
        height: 110px;
    }        

    .space_bottom {
        width: 600px;
        height: 50px;
    }
    
    /* タイトルフリガナ位置 */
    .furigana {
        font-size: 12px;
        color: #f0980f;
    }    
    
    /* ブログタイトル */
    .blog_title {
        width: 60%;
    }
    
    /* ブログアイコンイメージ */
    .blog_image {
        width: 300px;
        margin-top: -50px;
    }

    /********* Entrance *********/
    .gallery {
        float: left;
        margin-top: -30px;
        width: 70px;
        margin-right: 1em;
    }

    /* マリア書房アイコン */
    .maria_shobo {
        width: 80%;
    }
    
    .left_pane {
        width: 100%;
        text-align: left;
    }
    .right_pane {
        width: 100%;
        text-align: center;
    }  
    .organizer_list {
        width: 100%;
        text-align: left;
        padding: 0 0 0 0;
    }

	dl {
		display: flex;
		flex-wrap: wrap;
		border-top; none;
		text-align: left;
		padding: 0px;
	}
	dt.dt {
		vertical-align: middle;
		width: 25%;
		padding: 0px;
		box-sizing: border-box;
	}
	dd.dd1 {
		vertical-align: middle;
		width: 28%;
		padding: 0px;
		margin: 0;
		box-sizing: border-box;
	}
	dd.dd2 {
		vertical-align: middle;
		width: 47%;
		margin: 0;
		box-sizing: border-box;
	}
	dd.dd3 {
		vertical-align: middle;
		width: 75%;
		margin: 0;
		box-sizing: border-box;
	}

    /* イメージのサイズ変更 */
    .mobile { width:100%; }
    .woman1 { 
        float: left;
        margin-right: -30px;
        width:40%;
    }
    .woman2 {
        margin-top: 10px;
        width: 45%;
        height: auto;
    }
    
    .crop {
  0      width: 155%;
        height: auto;
        margin-left: -100px;
        overflow: hidden;
    }        
    .crop img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    
    .taisho {
        float: left;
        margin-left: 10%;
        margin-bottom: 1em;
    }

/********** Slarry ***********/

    .slarry_title {
        font-face: "ＤＦＰPOP1体W9,ＭＳ Ｐゴシック";
        font-size: 22px;
        font-weight: bold;
        color: #fc710a;
        border-bottom: 0;
    }

    .upper_line {
        border-top: solid 2px white;
        width: 80%;
        height:10px;
    }
    .lower_line {
        border-bottom: solid 2px white;
        width: 80%;
        height:10px;
    }
    
    .slarry_wrap {
        display: flex;
        flex-direction: column;
    }
    .slarry_menu {
        order: 2;
        margin-top: -100px;
        margin-rioght: auto;
        margin-left: 10%;
        line-height: 2;        
        width: 32%;
        text-align: center;
    }
    .slarry_icon {
        order: 1;
        margin-bottom: 0px;
        width: 100%;
        text-align: center;
    }
    .slarry_book {
        order: 3;
        margin-top: -150px;
        margin-right: 0;
        margin-left: auto;
        text-align: left;
        width: 40%;
    }

    .slarry_img  { width:100%; }
    .slarry_img1 { 
        width: 60%;
        margin-left: 20%;
        margin-top: 40px;    
    }

    /**************** レシピページ ******************/
    .page_recipe .imgl,
    .page_recipe .imgr,
    .page_recipe .imgn {
        float: none !important;
        width: 100% !important;
        margin: 10px 0 10px 0;
        text-align: center !important;
    }
    .page_recipe .imgl img,
    .page_recipe .imgr img,
    .page_recipe .imgn img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }

    .native img {
        width: auto !important;
        max-width: none !important;
        height: auto !important;
    }
    
}